談到React，就不得不提到React中最重要的一個API方法——setState，setState 在 React 中是經常使用的一個 API，但是它存在一些的問題經常會導致初學者出錯，核心原因就是因為這個 API 是異步的。
但其實setState也有同步執行的時候，假如setState出現在我們代碼自定義的dom事件中以及在setTimeout時，實際上setState是同步執行的：
bodyClick = () =>{
this.setState({
count:this.state.count+1,
)}
console.log(this.state.count);//理論上 我們在setState之后立即列印 是得不到最新結果的 但是這里可以拿到+1之后的count，代碼是同步執行的。
}
componentWillMount(){
document.body.addEventListener('click',this.bodyClick);
setTimeout（（）=>{
this.setState({
count:this.state.count+1,
)}
console.log(this.state.count);//理論上 我們在setState之后立即列印 是得不到最新結果的 但是這里可以拿到+1之后的count，代碼是同步執行的。
}）
}
看到這里不要迷糊，其實如果去深究setState的實作方式你就會發現這種情況并不奇怪，setState其實是被react特意設計成一種異步的實作方式，目的是為了避免dom的頻繁渲染（就比如連續多次呼叫setState會進行合并一樣，我們后邊會說），其實setState是異步還是同步執行，react內部有一個判斷標準，這個標準是判斷執行setState代碼時，是否處于batch update狀態，isBatchingUpdates是否被激活：
setState主流程
轉載請註明出處，本文鏈接：https://www.uj5u.com/qianduan/175562.html
標籤：JavaScript