处理Redux Store数据中的依赖关系

时间:2017-07-12 10:29:10

标签: redux flux

我和我的团队正在忙于设计redux商店,包括可以解雇的所有可能行动。由于我们的应用程序的性质,我们在redux商店的不同节点(分支?)之间存在一些固有的耦合/依赖关系。我们以最可扩展的方式处理这些依赖关系的想法是将其提取到状态树中它自己的单独节点。让我举一个简化的例子来说明我们想到的结构,并解决我们面临的问题:

假设我们的州树有以下内容:

  • SectionA:数据A为bool
  • SectionB:数据B为int
  • DependencySection:具有依赖关系,如果A为真,则B必须为10或更大

你可能在想,为什么这样做?为什么不将依赖项集成到SectionB的reducer中?原因是这些依赖关系因客户端而异,我们正在从数据库中读取它们。它可以将状态树的任何部分链接到任何其他部分,并且有自己需要发生的操作。

现在,我的问题是,我们如何在考虑这些依赖关系的同时减少行动?如果我们的申请流程是:

  1. 用户导致TOGGLE_DATA_A操作
  2. SectionA reducer更新数据A
  3. DependencySection根据依赖关系更新数据B
  4. 如果我们引入一个SectionC,会发生什么,数据C依赖于数据B?当DependencySection更新数据B时,似乎需要触发新操作,其中操作是数据B已更新。这意味着在减少另一个动作时触发动作,这显然是不允许的。或者,似乎使不同的reducer部分以非常特定的顺序执行也可以解决问题,但这肯定是一种反模式。

    我们可以提出的唯一解决方案是让中间件在每次操作后重复触发UPDATE操作,直到状态不再发生变化。例如,在TOGGLE_DATA_A操作更新数据B(通过对数据A的依赖)之后,下一个UPDATE操作将更新数据C(通过对数据B的依赖性),并且下一个UPDATE将不更新任何内容,停止循环。这非常黑客。

    那么,有没有更好的方法来减少这种依赖状态呢?或者我们应该以不同的方式构建我们的状态树?

1 个答案:

答案 0 :(得分:2)

Redux背后的一个关键概念是reducer逻辑只是函数,如果您需要按特定顺序订购状态更新处理,您可以通过编写显式代码来自行完成那。所以不,"使不同的减速器部分按特定顺序执行"是"反模式",它绝对是Redux的有效和鼓励方法。

有关此方法的示例和讨论,请参阅Redux文档的Structuring Reducers - Beyond combineReducers部分以及我的博文Idiomatic Redux: The Tao of Redux, Part 1 - Implementation and IntentPractical Redux, Part 7: Feature Reducers。我将粘贴一个基本的假设示例:

export function commentsReducer(state = initialState, action, hasPostReallyBeenAdded) {}

// elsewhere
export default function rootReducer(state = initialState, action) {
  const postState = postsReducer(state.post, action);
  const {hasPostReallyBeenAdded} = postState;
  const commentState  = commentsReducer(state.comments, action, hasPostReallyBeenAdded);
  return { post : postState, comments : commentState };
}