setState何时同步,何时异步,为什么?

setState何时同步,何时异步,为什么

答案:在React库控制时,异步;否则同步。

示例代码如下:

constructor(props){
    super(porps);
    this.state = {
        name:"异步"
    }
}
test(){
    this.setState({
        name:"同步"
    })
    alert(this.state.name)
}
<TouchableOpacity onPress={()=>this.test()}>
    <Text>Button</Text>
</TouchableOpacity> 
上文TouchableOpacity中,是React库控制,此时使用setState则为异步,alert值为"异步"。

如何才能触发同步呢?看如下代码:

test(){
    this.setState({
        name:"同步"
    },function(){
        alert(this.state.name)
    })
}

  此时使用回调的方式,即可触发同步,大部分开发中用到的都是React封装的事件,比如onChange、onClick、onTouchMove等,这些事件处理程序中的setState都是异步处理的。

 

React是怎样控制异步和同步的呢?

在 React 的 setState 函数实现中,会根据一个变量 isBatchingUpdates 判断是直接更新 this.state 还是放到队列中延时更新,而 isBatchingUpdates 默认是 false,表示 setState 会同步更新 this.state;但是,有一个函数 batchedUpdates,该函数会把 isBatchingUpdates 修改为 true,而当 React 在调用事件处理函数之前就会先调用这个 batchedUpdates将isBatchingUpdates修改为true,这样由 React 控制的事件处理过程 setState 不会同步更新 this.state。


 




 

posted @ 2019-11-21 19:44  云松编程  阅读(3733)  评论(0编辑  收藏  举报