由于react中把setState设置为异步操作函数,这有时候会给我们带来以一些问题,下面介绍一下怎么解决这个问题。
1. 在setState完成的回调里执行需要的操作
setState函数的第二个参数允许传入回调函数,在状态更新完毕后进行调用,譬如:
this.setState({
load: !this.state.load,
count: this.state.count + 1
}, () => {
console.log(this.state.count);
console.log('加载完成')
});
2. 传入状态计算函数
除了使用回调韩式的方式监听状态更新结果之外,react还允许我们传入某个状态计算函数而不是对象作为第一个参数。状态计算函数能够为我们提供可依赖的组件的state与props值,即会自动的将我们的状态更新操作添加到队列中并等待前面的更新完毕后传入更新的状态值:
this.setState(function(prevState, props){
return {需要改变的state的名称: 改变之后的state的值}
});