React的setState原理

http://www.itdecent.cn/p/1e7e956ec1ee


https://segmentfault.com/a/1190000017831695


在?合成事件?和?生命周期鉤子(除 componentDidUpdate)?中,setState是"異步"的;

原因: 因為在setState的實現(xiàn)中,有一個判斷: 當更新策略正在事務流的執(zhí)行中時,該組件更新會被推入dirtyComponents隊列中等待執(zhí)行;否則,開始執(zhí)行batchedUpdates隊列更新;

在生命周期鉤子調(diào)用中,更新策略都處于更新之前,組件仍處于事務流中,而componentDidUpdate是在更新之后,此時組件已經(jīng)不在事務流中了,因此則會同步執(zhí)行;

在合成事件中,React 是基于事務流完成的事件委托機制實現(xiàn),也是處于事務流中;

問題: 無法在setState后馬上從this.state上獲取更新后的值。

解決: 如果需要馬上同步去獲取新值,setState其實是可以傳入第二個參數(shù)的。setState(updater, callback),在回調(diào)中即可獲取最新值;

在?原生事件?和?setTimeout?中,setState是同步的,可以馬上獲取更新后的值;

原因: 原生事件是瀏覽器本身的實現(xiàn),與事務流無關,自然是同步;而setTimeout是放置于定時器線程中延后執(zhí)行,此時事務流已結束,因此也是同步;

最后編輯于
?著作權歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時請結合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務。

相關閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容