React-Redux交叉模块通信

Question

在React Redux中设置交叉模块通信的正确方法是什么？

假设有一个用例，在某些操作中，我需要对多个模块进行更新。代码应该放在哪里？

示例1：模块A控制视图A的视图A和模块B的操作。单击模块B中的链接，我需要向模块A和模块B分配一些操作。

或者，如果存在用例，我需要从模块A或模块B发送操作，但模块A和模块B中都需要执行某些操作。

我应该如何设计我的应用程序，以便它能够正确，干净地处理？ （我在我的应用程序中使用Ducks模式的代码排列，其中模块由actions + reducers + action creators组成）

Answer 1

这就是为什么我从概念上不喜欢“鸭子”模式的原因之一。引用我的帖子The Tao of Redux, Part 2 - Practice and Philosophy：

  

对我而言，“鸭子”模式有几个概念上的缺点。一个是它引导你远离多个切片减少器的想法，独立地响应相同的动作。没有任何关于“鸭子”会阻止你让多个减速器响应，但是将一切都放在一个文件中有点暗示它都是自包含的并且不太可能与系统的其他部分交互。还涉及依赖链和导入的某些方面 - 如果系统的任何其他部分想要从鸭子中导入动作创建者，那么它将在该过程中拖拽缩减器逻辑。 reducers实际上可能不会在其他地方导入，但是依赖于那个文件。如果这不打扰你，请随意使用“鸭子”。

我能想到的四种方法让两个模块的缩减器都能响应相同的动作：

1. 直接从模块B的“duck”中获取模块导入操作常量
2. 在单独的文件中定义操作常量，以便模块A执行import * as types from "moduleB/constants"。
3. 复制操作类型字符串，以便模块A实际上不从模块B
导入任何内容
4. 使用单独的副作用库（如saga或observable）以某种方式将行为粘合在一起。

我个人建议不要过多担心跨“模块”导入或依赖项，除非你真的试图完全保留应用程序的不同部分并完全封装其他所有部分。< / p>

Answer 2

视图由商店控制，对吗？

因此，当A或B中的某个动作发生时，只需调度一个动作，该动作将分别更新B或A中的视图。

{
  currentAView: 'product1'
}

单击B视图中的按钮。已发送的行动showProduct(product2)。

{
  currentAView: 'product2'
}