React ReRender in Redux

React ReRender in Redux

本文关键字：Redux in ReRender React      更新时间：2023-09-26

我正在我的 React 应用程序中使用 Redux，为了确保我不会改变状态而是返回新状态，我在开发中添加了中间件 https://github.com/leoasis/redux-immutable-state-invariant。

我的问题是，当存储发生更改时，我的所有组件都会重新渲染吗？

我正在观看这个关于不可变Js的视频 https://youtu.be/YFP8lbdZ0cs?t=33m59s 现在我不知道我是否应该在每个具有浅相等函数的组件中实现shouldComponentUpdate，或者这件事是通过自动反应完成的？（也许它在新版本中被更改了）

它应该打扰我吗？当我不使用 ImutableJs 并使用最新的 React 和 Redux 版本时，最好的方法是什么？

React Redux 包做了很多工作来确保包装的组件只在需要时渲染。 请参阅 http://redux.js.org/docs/FAQ.html#react-rendering-too-often 的相关 Redux 常见问题解答。 在我的 Redux 相关库目录中还列出了许多 React 渲染调试工具，它们可以显示您的组件何时实际重新渲染，以及原因。

也就是说，一般来说，在有证据表明您遇到实际性能问题之前，您不应该担心它。

在我回答你的问题之前，我想澄清一些事情供您理解，

  • 不可变性如何影响 react-redux

假设您有一个处于 Redux 状态的对象，并且您没有处理不可变性并更改了一个属性。现在，当您更改属性时，您希望它重新渲染，但由于对象引用没有更新（因为状态已更改），Redux 考虑其相同的状态并且不更新道具，因此不会重新渲染（我自己的经验）

  • 什么时候你应该考虑应该组件更新

假设你有一个非常大和复杂的表单，它考虑了 4 个子表单，现在每个表单访问一个部分道具。 但是当用户填写表单时，道具会不断变化，因此它会一次又一次地呈现。现在有两种解决方案

    一次仅呈现
  1. 用户可见的表单或部分，仅呈现当前 Tab（如果是多选项卡表单）
  2. 对 shouldComponentUpdate 进行全面检查，并且仅在 props 中的相关 prop 或对象的属性发生更改时才返回 true

现在ImmutableJs所做的是防止对象发生变化，因此您不会遇到您希望它重新渲染但没有的情况。

因此，完全

取决于您的喜好，您希望如何防止从aboe重新渲染两种解决方案

相关文章：