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

IT技术 reactjs
2021-04-24 12:57:51

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

4个回答

这就是 React 的构建方式。

这个概念是你不应该改变状态,像这样:

this.state.color = 'red';

相反,您应该使用 setState:

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

这背后的想法是,为了跟踪状态的变化而不是根据变化重新渲染组件,你必须使用 setState,因为在 setState 之后,渲染函数被触发。

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

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

这取决于 JavaScript 的工作方式,所有原始值(数字、字符串、布尔值、未定义、空值)在您键入let age = 34或类似内容时按值复制

但是对象和数组是通过引用复制的。您可以在此处阅读更多相关信息:JavaScript 是按引用传递还是按值传递语言?

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

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

React JS 是单向绑定,因此状态变量只能在 setState 上更改,因此它在 setState 中渲染一次。