Reactjs 如何在使用react redux时有效地设计组件/配置存储

如果我有一个组件树

//App.js
const App = () => (
      <React.Fragment>
        <A />
        <B />
        <C />
      </React.Fragment>
    )

//A.js
const A = () => (
      <React.Fragment>
        <ChildA />
      </React.Fragment>
)

//App.js
常量应用=（）=>(

为每个互斥组件创建多个reducer函数是否可以解决此问题？如果是，如何解决，如果不是，那么可以采取什么措施来减少不必要的重新渲染

更新：
除了@tmdesigned的答案之外，如果我创建了
a
的子组件，那么
childA
中的一些更新会导致
a
和
childA
重新渲染，而
childA
会重新渲染两次，因为两者都连接到公共还原函数

请参阅，@tmdesigned's sandbox，
在我看来，每个组件都需要有自己的功能，这一点很重要，以防止出现您所说的情况。例如，组件A呈现了需要有自己的还原程序和操作的人员列表。例如：

个人国家

persons: {
  data: [...]
  loading: false
  error: null
}

个人行为
PERSONS\u FETCH\u INIT
PERSONS\u FETCH\u SUCCESS
PERSONS\u FETCH\u FAIL

此外，您还需要使用react memo，如果组件A已订阅的状态更新，则组件A将触发对组件应用程序的重新渲染，然后所有子组件（如B、C等）都将重新渲染。
我对您的问题感兴趣，并检查了几次，希望有人能回答，我可以获得更深入的了解但这并没有发生，所以我做了一些调查，并建立了一个代码沙箱来准确地说明您的要求


在这里，您将发现一个简单的React+Redux应用程序，它有3个组件（a、B和C），每个组件依赖于不同的减速器（reducer、reducer、B和reducer），并且能够触发更新其减速器的操作（actionA、actionB和actionC）

您将在每个组件的渲染方法中看到一个
console.log
语句，它明确了每个组件何时被重新渲染

仔细研究一下，您会发现，只有在更新组件所关心的redux状态时，组件才已经智能地重新渲染了，而不是在更新存储的任何部分时

换句话说，它实际上不像您建议的那样工作（“如果我使用仅与组件A相关的数据更新存储，那么B、C也将被重新呈现。”）。当然，这些其他组件可以通过很多方式重新呈现，但在这里最基本的示例中，它们没有

酷吧？
你似乎建议为应用程序中的每个主要组件创建一个减速器。但我仍然不相信为每个减速器功能创建三个操作的想法。不完全是，为商店的每个状态创建一个操作和减速器，如：用户、身份验证等。如果你给我一个应用程序概述，我可以帮你为商店建模！：）我认为我们需要非常小心地将组件连接到redux商店，至少我们应该只将顶级组件连接到商店，并将数据作为道具传递给它们的子组件。这将至少限制子组件的额外呈现。这是一个有趣的问题。redux的一大好处是，你可以在任何地方访问商店，而不需要像你所说的那样进行属性链接。然而，你至少部分是对的。我已经用一个子组件更新了这个示例。有趣的是，当子对象触发更新时，确实会得到双重重新渲染，但当父对象触发更新时，则不会。我不确定是什么原因导致了这里的第一次重新渲染，但无论如何都不是redux存储更新（该值仍然是较早的值）。每当A的子组件触发更新时，Reducer会更新状态，导致重新渲染
A
，这也包括重新渲染A的子组件，另外，由于子对象也连接到存储，因此会发生额外的重新渲染。虽然，它提出了更多的问题，但这似乎是一个可能的原因。但是，既然如此，为什么不点击一个按钮，导致同样的两个重新渲染呢？一个用于redux->child update，一个用于redux->parent update->child update？实际上，它没有重新呈现，毕竟是因为商店更新，就像我在几条评论之前建议的那样。这是一个剩余的setState调用，不再需要了，导致子组件重新运行了一段额外的时间（感谢我的同事指出这一点）