在使用React過程中，中可以使用this.state來訪問需要的某些狀態(tài)，但是需要更新或者修改state時(shí)，一般而言，我們都會(huì)使用setState()函數(shù)，從而達(dá)到更新state的目的，setState()函數(shù)執(zhí)行會(huì)觸發(fā)頁面重新渲染UI。但是?。?！setState是異步的！??！

1. 語法：

setState(updater[, callback]) //

updater是要改變的state對象，callback是state導(dǎo)致的頁面重新渲染的回調(diào)，等價(jià)于componentDidUpdate
一般而言，在設(shè)置頁面某些state的時(shí)候，需要先設(shè)置好state，然后再對頁面的一些參數(shù)進(jìn)行修改的時(shí)候，可以使用setState的回調(diào)函數(shù)。

2. 分析一下區(qū)別

不在回調(diào)中使用參數(shù)，我們在設(shè)置state后立即使用state：

this.state = {foo: 1};this.setState({foo: 123});console.log(this.state.foo);// 1

在回調(diào)中調(diào)用設(shè)置好的state

this.state = {foo: 2};this.setState({foo: 123}, ()=> { console.log(foo); // 123});

關(guān)于setState的回調(diào)函數(shù)的作用大概如此，這個(gè)函數(shù)相當(dāng)于componentDidUpdate函數(shù)，和生命周期的函數(shù)類似。

3. 注意：

1. 剛說了，setState是異步的！不保證數(shù)據(jù)的同步。
2. setState更新狀態(tài)時(shí)可能會(huì)導(dǎo)致頁面不必要的重新渲染，影響加載。
3. setState管理大量組件狀態(tài)也許會(huì)導(dǎo)致不必要的生命周期函數(shù)鉤子調(diào)用。

參考文檔：https://facebook.github.io/react/docs/react-component.html#setstate

以上就是本文的全部內(nèi)容，希望對大家的學(xué)習(xí)有所幫助，也希望大家多多支持武林網(wǎng)。