javascript - 为什么React setState可以异步？

Question

我知道 setState 可以是同步的或异步的:

setState() does not immediately mutate this.state but creates a pending state transition. Accessing this.state after calling this method can potentially return the existing value.

There is no guarantee of synchronous operation of calls to setState and calls may be batched for performance gains.

是的，我知道该函数执行一些事情:

• 更新州内的实际值
• 根据需要使用新状态值更新虚拟 DOM 和真实 DOM

但是我想弄清楚的是为什么这有时是同步的，有时是异步的？幕后发生了什么？为什么不能始终同步？

谢谢。

Answer 1

您的状态更改可能来自多个来源(取决于您的应用)，并且组件中的每个状态更改都安排在队列中。因此，如果您在组件中执行 this.setState() ，那么它会与所有其他潜在的 setState 一起等待该组件被解析。当您执行类似 this.setState({ value: this.state.value + 1 }) 并期望结果时，可能会发生这种情况然后此操作正在等待解决，并且如果在等待期间发生了另一个操作操作系统状态更改那么我们将在最新的 this.stare.value 上进行操作，从而导致意外的返回。一般来说，当我处理基于先前状态的状态更改时，我会以这种方式更改状态: this.setState((prevState) => prevState.value + 1) 这意味着我正在传递以下状态我目前已经根据这个记住的状态进行修改，而不必依赖 this.state。