我是反应和还原的新手。我有一个场景，其中有这样的嵌套组件。
A > B > C > D
A 组件中使用了一个属性，D 组件中也会使用该属性。所以，我有两种方法：
- 从组件 A 中的 redux 存储获取状态，然后将其作为 props 传递给其所有子组件，即使它仅在 D 组件中使用。
- 我应该连接到组件 D 中的 redux 存储并从那里获取该属性。
正确的做法是什么？
正如 redux 的作者 Dan Abramov 在这篇文章中所说issue https://github.com/reactjs/react-redux/issues/159
将道具传递给孩子或将他们连接起来的两种方法
到商店是合适的，但是嵌套了connect()组件实际上会给你带来更多的性能。这
缺点是它们与应用程序的耦合程度更高
测试起来稍微困难一些，但这可能不是一个大问题。
他还阐明了一个可以遵循的很好的经验法则reddit https://www.reddit.com/r/reactjs/comments/4azg7q/using_redux_how_do_you_handle_subcomponents_of_a/
我这样做：
- 首先使用一个容器和多个演示组件
- 随着展示组件树的增长，“中间”组件开始向下传递太多的 props
- 此时，我将一些叶组件包装到容器中，以便“中间”组件不需要接受和传递以下 props
与他们完全无关
- Repeat
他甚至有tweeted https://twitter.com/dan_abramov/status/668586001175048192关于这一点：
尝试将演示组件分开。创建容器
每当您觉得要在父组件中复制代码以为同类子组件提供数据时，就需要提取容器了。
简而言之：
您可以使用connect()在任何级别。这样做会使组件变得智能，因为它知道它的 props 来自哪里。一个愚蠢的组件只有 props，它们可以来自任何地方。一个智能组件耦合到redux；哑组件则不然。
更新：react-redux v7 及以上版本
同样的概念适用于useSelectors也。如果容器组件的多个子组件使用相同的数据，您可以在容器组件中接收数据并将其传递给演示组件
但是如果孩子们使用的数据不同，您可以选择使用useSelector单独在子组件中。这将确保只有那些实际需要重新渲染的组件
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)
