react中的setState是同步還是非同步還是?

2021-10-08 23:22:42 字數 1488 閱讀 6119

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的屬性,遇到這樣的情況我們一...