为什么我们不能在不调用 setState() 的情况下更改 React 中的状态 [重复]答案

【问题标题】：Why we can't change states in React without calling setState() [duplicate]为什么我们不能在不调用 setState() 的情况下更改 React 中的状态 [重复]
【发布时间】：2023-03-26 04:57:01
【问题描述】：

我想知道为什么我们只使用setState() 来更新 React 中的状态？

为什么我们不能做这个？

this.state.vote = this.state.vote + 1

【问题讨论】：

您可以阅读文档的State and Lifecycle 部分。
也检查一下：stackoverflow.com/questions/37755997/…

标签： reactjs

【解决方案1】：

之所以需要使用setState() 方法是因为一个叫做可变性的概念。

当 React 组件中的状态发生变化时，您通常希望它触发组件的重新渲染（以反映这些变化）。除非shouldComponentUpdate 阻止，否则使用setState 将始终触发重新渲染。通过像this.state.vote = this.state.vote + 1 那样设置状态对象的属性，您正在更改现有的状态对象。由于 javascript 中对象的工作方式，React 无法轻易判断该对象已更改。

当您使用 React 的 setState() 方法时，您正在创建 React 识别的状态对象的新版本，并且反过来知道它需要重新渲染组件。

这是一个简化的解释，但希望它能向您解释核心概念。

Here's an interesting article to read about mutation

【讨论】：

补充这个问题：它不仅添加了一个新版本的对象，React 创建了一个包含组件中的反应元素的新树（以及更新的状态）。该树用于通过将组件的 UI 与前一棵树的元素进行比较来确定组件的 UI 应如何响应状态变化而变化。 React 知道要实现哪些更改，并且只会在必要时更新 DOM 的部分。