react的this.setState异步影响和处理

react的this.setState是常用的API,但是因为它是异步的,所以会导致数据获取存在异常,如

//假设this.state.isOpen = false,下面设置了isOpen为true,再打印isOpen的值,还是为false

this.setState({

      isOpen: true,

});

console.log(this.state.isOpen);         //值仍为false

处理方法有两种:等待和使用回调函数

方法一,等待:

await this.setState({

      isOpen: true,

});

console.log(this.state.isOpen);         //值为true

方法二,使用回调函数:

this.setState({

      isOpen: true,

}, ()=> {console.log(this.state.isOpen)});