为什么React必须使用setState进行状态更新？

Question

为什么必须使用setState更新状态（树协调）。而不是简单地初始化this.state.color ='red';假设颜色的先前值是“绿色”。

Answer 1

使用this.state.color = 'red'不会触发重新渲染，而this.setState({ color: 'red })会触发。还有其他事情要考虑。

https://reactjs.org/docs/state-and-lifecycle.html#do-not-modify-state-directly

Answer 2

这就是React的构建方式。

概念是，您不应像这样可变地改变状态：

this.state.color = 'red';

相反，您应该使用setState：

this.setState({color: 'red'});

其背后的想法是，为了跟踪状态的变化并根据更改重新渲染组件，您必须使用setState，因为在setState之后，将触发render函数。

Answer 3

另一个imp的原因是使用setState返回一个新状态并且不会改变原始状态，可以传递给一个纯组件。由于纯组件只在没有返回新状态的情况下对对象进行浅渲染，因此组件不会重新渲染。

Answer 4

使用this.state.color = 'red';更改状态时，它不会触发重新渲染。

this.setState({color: 'red'})将创建一个新状态并将其分配给this.state，并以不可变的方式对其进行更改，因此React将知道它已更改并重新呈现组件。

这取决于JavaScript的工作方式，当您键入let age = 34或类似的东西时，所有原始值（数字，字符串，布尔值，未定义，空值）都将按值复制。

但是对象和数组是通过引用复制的。 您可以在这里了解更多信息：Is JavaScript a pass-by-reference or pass-by-value language?

Answer 5

React JS是单向绑定，因此状态变量只能在setState上更改，因此一旦setState在set中就会呈现。