我对 Redux 很陌生,想在我的应用程序中使用它,但我被困在 Redux 部分的架构/设计阶段。以下是我对设计的要求和假设。
应用程序详细信息: 带有 AngularJS 的 SPA。其他库使用ng-redux、reselect、rxjs。
组件详细信息: 可重用的网格组件以呈现大量数据。
我的想法: 创建一种即插即用的基于组件的架构,其中网格的所有内部组件都独立于父/组合组件,如搜索、排序、行、标题、单元格。
所有组件都将拥有自己的一组 reducer、action、selector 和 store 中的 state slice。
因为所有组件都有自己的reducer,并且可以按需插入,所以我需要它们懒惰地注册到store,而不是在一个地方堆积。
一些组件,如搜索、排序以及拥有自己的状态,也会影响其他组件的状态。例如:设置查询参数(searchText、sortOrder 等)以获取将由另一个组件处理的网格数据。
我的想法:
对于第一点,我正在研究重新选择以提供相关的状态切片。
对于第二点,我仍然对使用combineReducers / replaceReducer进行延迟注册感到困惑。如果我想访问该州的多个部分,我觉得combineReducers不适合。
对于第三点,我正在考虑以下方法:
一个。在需要更新状态的多个部分的地方通过getState()传递整个状态。虽然这种方法让我感觉 Redux 使用不当。
湾。组件A触发其自己的操作来更新其状态部分,然后为另一个组件B触发另一个操作以更新其状态片。这种方法也感觉像打破了 Redux 的整个想法,虽然我不知道如何使用它,但可以在这里使用副作用的概念,也许是redux-saga,redux-thunk等。
注意:使用任何一种方法都不应该导致组件知道其他组件,因此任何必须做的事情都将通过传递一个通用的配置对象来完成,例如{ actionsToFire: ['UPDATE_B'] }
.
在应用程序的页面之间来回导航时我需要状态管理,但我不需要从服务器端热重载、动作重播或预取应用程序状态。
组件也将负责在不再需要时销毁其状态。并且状态将具有规范化的结构。
我知道这些要求可能看起来很奇怪或不常见,但我会保持这种状态。
我已经知道的几件事是:
我不需要像 Dan 的经典文章所说的那样使用 Redux,但我认为在这种情况下我需要它。
我知道 Smart 和 Dumb 组件,主要是我的组件可能看起来很聪明(即知道应用程序状态),但这就是我想要保留它们的方式,我可能错了。
网格组件示意图: