Reactjs React.js如何重新呈现组件？

我是新来的。我正在浏览他们的文档以了解react是如何工作的。所以有人提到，当state/props/setState（）更改/调用时，react会重新启动整个组件

此外，我还了解到react元素是不可变的，只有在发生更改时才会呈现它们。因此，当react试图呈现组件时，它实际上会遍历所有元素，检查差异，并仅呈现其数据已更改的元素。它不会简单地重新渲染整个组件

---

我说的对吗？还是我的理解有误？

你是对的，当道具或状态改变时，react会重新渲染组件。 也就是说，当一个子组件收到新的道具时，react不会在您使用

react.component

时检查道具是否已更改，它只是重新渲染，即使您再次传递相同的道具

为了使组件仅在收到不同的道具时才渲染，对于类组件，可以使用

React.PureComponent

，对于功能组件，可以使用

React.memo（）

包装组件

我读到React元素是不可变的，只有在发生更改时才会呈现它们

说React元素是不可变的不是真的，您需要将它们视为不可变的，尤其是组件的

因此，当React试图呈现组件时，它实际上会遍历所有元素，检查差异，并仅呈现其数据已更改的元素

默认行为是当父级通过调用

setState

（触发组件的子树上的对帐）重新排序时，呈现所有子树

所以说它将在“数据更改”上渲染组件是不正确的，默认情况下它们将重新渲染，即使“数据”没有更改

所谓“数据已更改”，我们指的是道具更改（默认情况下为浅比较，使用备忘录进行更改）

---

我们可以用它来帮助对账过程。

我认为，当React组件重新呈现时，一种更清晰的总结方法是：

仅在以下情况下，反应组件才会重新渲染：

它们的状态更改（通过

setState（）

或

useState（）

）

他们通过了新的道具

它们的父组件将重新渲染

注意事项：

• 要重新渲染组件，必须正确更新状态，即通过

  setState（）

  或

  useState（）

  。如果状态通过其他“非法”方式更改，例如直接访问状态，React不会注意到，也不会重新呈现组件

• React道具是只读的，所以当我们说“当组件的道具发生变化时”，我们实际上是指当组件被传递时，道具的值发生了变化。道具不应在组件内发生变异

• 如果使用

  useMemo（）

  或

  React.memo（）

  ，则只有在父组件重新渲染时，如果其接收的道具已更改，子组件才会重新渲染

• 区分重新呈现虚拟DOM和更新实际DOM是很重要的。组件重新渲染并不意味着它更新了DOM。当组件重新呈现时，React会将新版本与以前的版本进行比较，并且仅在发生更改时更新实际DOM

---

是的！你说得对。