如果同步执行 的话
console.log(this.state.value) // 0
this.setState({ value: this.state.value + 1 });
console.log(this.state.value) // 1
this.setState({ value: this.state.value + 1 });
console.log(this.state.value) // 2
通常共享状态需要做状态提升
-this.setState({ value: this.state.value + 1 });
+this.props.onIncrement(); // Does the same thing in a parent
这就回打乱我们代码,props只会在父组件更新时更新
console.log(this.props.value) // 0
this.props.onIncrement();
console.log(this.props.value) // 0
this.props.onIncrement();
console.log(this.props.value) // 0
在同步这种情况下,会立即刷新this.state,但不会刷新this.props。我们无法在不重新渲染父级的情况下立即刷新this.props(如果同步刷新,性能大大降低)
if you’re mixing data from props
(not yet flushed) and state
(proposed to be flushed immediately) to create a new state
那么React今天如何解决这个问题呢?在React中,
this.state
和都this.props
仅在协调和冲洗之后更新,因此您会看到0
在重构前后都被打印。这使提升状态安全。