亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

為了賬號安全,請及時綁定郵箱和手機立即綁定
已解決430363個問題,去搜搜看,總會有你想問的

這段代碼中 setState 工作方式的混亂

這段代碼中 setState 工作方式的混亂

MMTTMM 2021-09-30 13:58:23
我是 React 的新手,正在學習 setState 的工作原理。所以,你可以看到下面的代碼:class Counter extends React.Component {  constructor(props) {    super(props);    this.handleReset = this.handleReset.bind(this);    this.state = {      count: 5    };  } handleReset() {    this.setState({count:0})this.setState({count:this.state.count+1})}render() {    return (      <div>        <button onClick={this.handleReset}>reset</button>      </div>    );  }所以,我從上面的代碼中期望的是,當我點擊按鈕時,它不是輸出 1,而是將 1 添加到計數的當前狀態并顯示 6。這就是我假設 setStates 在 handleReset 方法中工作的方式。我不知道為什么它呈現 6 而不是 1
查看完整描述

2 回答

?
慕桂英3389331

TA貢獻2036條經驗 獲得超8個贊

setState可以將更新程序函數作為參數。在這種情況下,該函數將傳遞前一個狀態,并且您返回一個更改對象,該對象將通知下一個狀態。

文檔甚至直接提到了這一點。

setState()并不總是立即更新組件。它可能會批量更新或推遲更新。這使得this.state 在調用setState()潛在陷阱后立即閱讀。相反,使用 componentDidUpdatesetState回調(setState(updater,callback)),保證在應用更新后觸發。如果您需要根據之前的狀態設置狀態,請閱讀 [在文檔中]的 updater 參數。

所以而不是:

this.setState({ count: this.state.count + 1});

...你可以做:

this.setState((prevState) => ({ count: prevState.count + 1 }))

有關更多信息,另請參閱學習反應文章。


查看完整回答
反對 回復 2021-09-30
  • 2 回答
  • 0 關注
  • 207 瀏覽
慕課專欄
更多

添加回答

舉報

0/150
提交
取消
微信客服

購課補貼
聯系客服咨詢優惠詳情

幫助反饋 APP下載

慕課網APP
您的移動學習伙伴

公眾號

掃描二維碼
關注慕課網微信公眾號