如果可以使用async / await使React的setState同步怎么办

Question

由于React的setState函数是异步的，因此，您无法在调用this.setState的同一函数中访问新更新的状态，因此在setState上使用async / await的优点和缺点，例如{{ 1}}

Answer 1

await关键字需要用于返回Promise的表达式，尽管setState是异步的，但它不会返回Promise，因此await不能使用它。 setState提供了一个callback来跟踪其是否已完成。

您将使用类似回调的方法

this.setState({
   newState
}, () => {
    console.log(this.state.newState)
})

Here is a demo显示setState不适用于async await

Answer 2

没有专业人士，因为this.setState不会返回承诺，await兑现承诺不是很好的目的。

应该与await一起使用它

const setStateAsync = updater => new Promise(resolve => this.setState(updater, resolve))

由于通常使用setState，因此通常不会使用太多。如果需要依赖先前设置的状态，则可以使用更新程序功能。