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。
原文出处:https://www.cnblogs.com/gooldns/p/11907812.html
来源:oschina
链接:https://my.oschina.net/u/4264835/blog/3246579