當前位置:編程學習大全網 - 網站源碼 - React之正確修改state

React之正確修改state

state可以通過this.state.{屬性}的方式直接獲得,但當修改state時,往往有很多陷阱需要註意。下面介紹常見的三種陷阱。

直接修改state,組件並不會重新觸發render,例如:

正確的修改方式是使用setSate();

很多開發剛開始沒有註意到 setState 是異步的。如果妳修改壹些 state ,然後直接查看它,妳會看到之前的 state 。這是 setState 中最容易出錯的地方,如:

另外,需要註意的是props的更新也是異步的。

如果需要在 setState 後直接獲取修改後的值,可以使用回調函數,setState 方法接收壹個 function 作為回調函數。這個回調函數會在 setState 完成以後直接調用,這樣就可以獲取最新的 state 。如:

當調用setState修改組件狀態時,只需要傳入發生改變的state,而不是組件完整的state,因為組件state的更新是壹個合並的過程。例如,壹個組件的狀態為:

當只需要修改title時,將修改後的title傳給setState即可:

React會合並新的title到原來的組件狀態中,同時保留原來的狀態content,合並後的state為:

  • 上一篇:Netstumbler是什麽?怎麽用?
  • 下一篇:英文報紙資源代碼是什麽?
  • copyright 2024編程學習大全網