javascript - React.js : Will multiple async setState method calls always re-render after and impact performance?

我见过一个带有回调的 React setState 方法，这意味着在确保设置新状态并重新渲染组件后将执行回调，例如这个例子:

this.setState({value: event.target.value}, function () {
    console.log(this.state.value);
}); //new state will be logged to console after it was set and rendered

现在，如果我不是完全错了，同样的事情可以使用 async 来实现
职能:

async someFunction(){
await this.setState({value: event.target.value});
console.log(this.state.value);
}

我现在的问题是，如果我在一个函数中使用多个 await setState 调用会影响性能吗？它会在每次 setState 调用后重新渲染并等待它完成渲染过程，然后执行 net await setState 调用等并可能产生性能问题吗？例如:

async someFunction(){
await this.setState({value: event.target.value});
let result = await someAPICall();
await this.setState({resultApiCall: result});
await.....
}

最佳答案

是的，你完全错了 :) setState 不返回 promise ，因此你不能只是 await 它。当然，您可以将回调包装到 promise 中，但您可能不需要它(因为您通常不需要等待重新渲染)。



当然。调用函数两次估计比调用一次慢两倍。



是的，如果你想 await 一个 Promise，像这样:

 await new Promise(resolve => this.setState(/*...*/, resolve));

不，可能不是。调用 setState 会执行得非常快，你必须调用它数百次才能影响性能。

关于javascript - React.js : Will multiple async setState method calls always re-render after and impact performance?，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/56925527/