reactjs - React中什么时候应该将组件连接到redux？

Question

例如，我有这样的组件结构:

<Parent>
      <Child_1>
            <InnerChild_1 />
      </Chidl_1>
      <Child_2>
            <InnerChild_2 />
      </Chidl_2>
</Parent>

组件<Parent>连接到 redux。有什么更好的更新方式<InnerChild_1 />对于应用程序状态，从 <Parent> 发送此数据与 props或连接<InnerChild_1 />还原？如果连接，我应该将所有使用状态的组件连接到 redux 吗？

Answer 1

尽管其他所有答案都表明您应该 connect您的顶层，这确实是一个旧的建议，仅对非常简单的应用程序有用。

使用connect无论何时您需要使组件与 Redux 存储保持同步。在您的示例中，如果 <Parent />没有使用任何状态，它的作用只是组合性的，我不会连接那个。我会将 Parent 保留为标准 React 组件，并单独连接子项。

对于大型列表或具有嵌套实体的复杂数据结构，这就是要走的路。

如果您选择其他方式，并连接到最顶层的组件，那么任何状态更改都将导致组件树完全重新渲染，而不会自动优化。因为connect ed 组件将实现 shouldComponentUpdate对于您来说，将多个项目连接到商店通常会获得更好的性能，而不是连接“列表”父级并在每次更改时重新渲染每个项目。

请参阅 Redux 文档中的 React-Redux 常见问题解答: http://redux.js.org/docs/faq/ReactRedux.html#react-multiple-components

具体:

Early Redux documentation advised that you should only have a few connected components near the top of your component tree. However, time and experience has shown that that generally requires a few components to know too much about the data requirements of all their descendants, and forces them to pass down a confusing number of props.