使用 await setState() 是否正确?

IT技术 javascript reactjs async-await setstate
2021-05-22 18:26:32

我的功能是这样的:

this.setState(prevState => ({
 time : prevState.time + 1
}), function() {
 doSomethingWithNewState(this.state.time)
})

在这种情况下使用 await 是否正确?像这样:

await this.setState(prevState => ({
 time : prevState.time + 1
}));
doSomethingWithNewState(this.state.time);
4个回答

没有this.setState不返回的Promise。

所以在这种情况下你不能使用 await 。您需要使用回调。

this.setState由于已经说明的原因,您不能等待但是您可以轻松编写自己的可等待 setState 函数:

promisedSetState = (newState) => new Promise(resolve => this.setState(newState, resolve));

现在你可以打电话

await promisedSetState({ someState: true });

正如前面的答案所提到的,setState()不返回 Promise,所以你不能await按你的意图使用它(虽然你也可以await同步代码)。

当它说setState()异步的,什么样的意思是,影响setState()可能在稍后的时间发生。

此外,在阅读this.state时的回调被执行在回调函数会给你在那个特定的时刻组件的状态,这不是正是你所期望的,因为所有的回调函数调用一批的setState()通话被执行. 见这个问题)。

当然不。您可以将回调传递给setState这样的:

this.setState(prevState => ({
 time : prevState.time + 1
}), 
() => doSomethingWithNewState(this.state.time));