setstate 只在合成事件和鉤子函式中是「非同步」的,在原生事件和 settimeout 中都是同步的。
合成事件:就是react 在元件中的onclick等都是屬於它自定義的合成事件
原生事件:比如通過addeventlistener新增的,dom中的原生事件
setstate的「非同步」並不是說內部由非同步**實現,其實本身執行的過程和**都是同步的,只是合成事件和鉤子函式的呼叫順序在更新之前,導致在合成事件和鉤子函式中沒法立馬拿到更新後的值,形式了所謂的「非同步」,當然可以通過第二個引數 setstate(partialstate, callback) 中的callback拿到更新後的結果。
setstate 的批量更新優化也是建立在「非同步」(合成事件、鉤子函式)之上的,在原生事件和settimeout 中不會批量更新,在「非同步」中如果對同乙個值進行多次 setstate , setstate 的批量更新策略會對其進行覆蓋,取最後一次的執行,如果是同時 setstate 多個不同的值,在更新時會對其進行合併批量更新。
componentdidmount()
);console.
log(
this
.state.value)
// 0
this
.setstate()
; console.
log(
this
.state.value)
// 0
settimeout((
)=>);
console.
log(
this
.state.value)
// 2
this
.setstate()
; console.
log(
this
.state.value)
// 3},
1000
)}
}>
<
/button>
handlebutton=(
)=>);
console.
log(
this
.state.value)
// 0
this
.setstate()
; console.
log(
this
.state.value)
// 0
settimeout((
)=>);
console.
log(
this
.state.value)
// 2
this
.setstate()
; console.
log(
this
.state.value)
// 3},
1000
)}
react中state與setstate的使用
我們可以利用state來定義一些變數的初始值 放在construcor裡 this.state 要更改state裡的值,注意要遵循react裡immutable規範,state不允許我們做任何改變,只能通過setstate來更改 const list this state.list list.spl...
React中setState為非同步機制
setstate用來更改state,並觸發render方法重新渲染頁面,這之間要經過react核心中diff演演算法比較dom樹,最終決定是否需要被渲染如何渲染。如何在第一時間獲取並應用setstate的值,set完第一時間呼叫方法即可獲取 如 this.setstate nowstate 便利 1...
React中setState修改深層物件
在react中經常會使用到setstate,因為在react生態中,state就是一切.在開發過程中,時長會在state中遇到一些比較複雜的資料結構,類似下面這樣的 state objb objc objd d 這時需要我們修改list中obja中的name屬性和objd的屬性,遇到這樣的情況我們一...