Angularjs Redux存储应为每个模块一个，或为包含多个Mudule的整个应用程序一个

我正在用Redux集成或重写Angular 1应用程序。它具有以下体系结构：

app1=>app1在diff子域上运行
app2=>app2在diff子域上运行
等等
共享=>共享模块（具有多个组件）b/w app1和app2

应用程序由多个特定模块组成
共享目录有一个或多个模块，在两个或多个应用程序之间共享

所以我的问题是我应该有应用程序级商店还是模块级商店

我所说的应用程序级商店和模块级商店是指，例如：

假设我们有一个共享模块

SM1

，它在两个应用程序之间共享

SM1

在

app1

内部使用时应使用

app1

的存储，在

app2

内部使用时应使用

app2

的存储。但是一个模块应该是一个自我维持的实体，它不应该依赖任何其他东西来存储

或者

SM1

可能有自己的商店，不与任何应用共享。但是当在

app1

中使用

SM1

时，其存储将与

app1

的存储冲突

另外，如果我使用模块级存储，那么模块和应用程序都需要提供

ngRedux

依赖项，这些依赖项看起来有点冗余

就可扩展的体系结构和核心原则而言，这里的最佳解决方案是什么？

是为一个非常类似的用例而创建的（事实上，我们还从angular 1迁移了两个独立的应用程序，以使用它们之间的共享组件进行react/redux）。它允许您拥有一个单独的存储区，并为共享组件隔离其中的一部分

基本概念是，父应用程序将组件的reducer合并到其存储中，然后创建子存储，返回简化的状态树和命名空间调度的操作

注意：我没有使用angular w/redux，我也不知道如何将两者集成，所以我只想展示一下如何创建子商店，并希望它能为您工作（如果您能让它工作，我很想知道，这样我们就可以在我们的文档中扩展支持的框架）

现在，对这些子商店的分派操作也只会影响它们的状态

component1Store.dispatch({ type: 'INCREMENT'})

console.log('store state:', store.getState()) // { "component1": { "value": 2 }, "component2": { "value": 10 } }
console.log('component1Store state:', component1Store.getState()) // { "value": 2 }
console.log('component2Store state:', component2Store.getState()) // { "value": 10 }

component2Store.dispatch({ type: 'INCREMENT'})

console.log('store state:', store.getState()) // { "component1": { "value": 2 }, "component2": { "value": 10 } }
console.log('component1Store state:', component1Store.getState()) // { "value": 2 }
console.log('component2Store state:', component2Store.getState()) // { "value": 10 }

请注意，分配到

component2Store

中的

增量

操作没有更改

component1Store

的状态。如果我们发送

减量

操作，则情况正好相反

component1Store.dispatch({ type: 'DECREMENT'})

console.log('store state:', store.getState()) // { "component1": { "value": 2 }, "component2": { "value": 10 } }
console.log('component1Store state:', component1Store.getState()) // { "value": 2 }
console.log('component2Store state:', component2Store.getState()) // { "value": 10 }

component2Store.dispatch({ type: 'DECREMENT'})

console.log('store state:', store.getState()) // { "component1": { "value": 2 }, "component2": { "value": 9 } }
console.log('component1Store state:', component1Store.getState()) // { "value": 2 }
console.log('component2Store state:', component2Store.getState()) // { "value": 9 }

此时，您需要了解如何将这些子存储注入到共享组件中

希望这对你有用

---

免责声明：我是redux子空间的作者

我会尽可能地支持松耦合：

• app1-自有商店（集成sm商店）
• app2-自有商店（集成sm商店）
• sm-自有商店

---

但是，如果我将我的商店映射到某种程度上完全复制我的后端数据库，那么商店中的项目就不会有任何冲突。在这种情况下，为什么要使用redux子空间呢？它可能适合你，也可能不适合你（如果不适合的话，没有什么不好的感觉）。redux子空间的主要优点是，您的

SM1

存储有一个已知的状态起点，因此

app1

和

app2

可以将

SM1

缩减器组合到任意位置（例如不同的嵌套级别、不同的键等）。另一个优点是来自

SM1

get名称空间的操作，因此它们不会与使用相同操作类型的操作的其他子模块发生任何串扰。随着每个应用程序的发展和越来越多的子模块（甚至子模块）的添加，这种隔离使得未来的维护更加容易。

component1Store.dispatch({ type: 'DECREMENT'})

console.log('store state:', store.getState()) // { "component1": { "value": 2 }, "component2": { "value": 10 } }
console.log('component1Store state:', component1Store.getState()) // { "value": 2 }
console.log('component2Store state:', component2Store.getState()) // { "value": 10 }

component2Store.dispatch({ type: 'DECREMENT'})

console.log('store state:', store.getState()) // { "component1": { "value": 2 }, "component2": { "value": 9 } }
console.log('component1Store state:', component1Store.getState()) // { "value": 2 }
console.log('component2Store state:', component2Store.getState()) // { "value": 9 }