this.setState作用?
在react中要修改this.state要使用this.setState,因為this.state只是一個對象,單純的修改state並不會觸發ui更新.
this.setState在修改state的同時,會調用render函數從而觸發組件的更新
(實際上this.setState修改完數據后,在調用的生命周期順序為:shouldComponentUpdate->componentWillUpdate->
render->componentDidUpdate)
this.setState寫法?
this.setState有兩個參數,寫法如下:
或者this.setState(()=>{return {msg:’xxx’}},()=>{});
或者this.setState(()=>({msg:’xxx’}),()=>{});
第一個參數是異步執行,第二個參數是異步執行完后執行.
第二個參數的作用是獲取最新的數據和最新的dom,可以用來驗證數據是否修改成功等同於componentDidMount
this.setState都是異步的嗎?
由React控制的事件處理程序,以及生命周期函數調用setState不會同步更新state 。
React控制之外的事件中調用setState是同步更新的。比如原生js綁定的事件,setTimeout/setInterval等。
大部分開發中用到的都是React封裝的事件,比如onChange、onClick、onTouchMove等,這些事件處理程序中的setState都是異步處理的
為什么是異步的?
setState異步是因為在state更新量大的時候,可以批量更新state,在一段時間內等待一部分數據更新完,在更新
this.setState為什么在原聲中是同步的?
因為react自己封裝了一套機制代理原生事件,這就是合成事件,比如onClick,在合成事件中有原生事件沒有的功能,這些多出來的導致setState執行是異步的.而在原生事件也就是非合成事件中是同步的
setState執行后觸發了那些函數
我們知道setState執行后會觸發render渲染,但並不只是render這一個生命周期,具體是:
setState->shouldComponentUpdate->componentWillUpdate->render->componentDidUpdate