Question

我的商店看起来像这样：

{
    nodes: {
        node1: { childIds: [], },
        node2: { childIds: [], },
    },
    selectedNode: 'node1',
}

我有这样的ADD_CHILD操作：

export function addChild(parentId, childId) {
  return {
    type: ADD_CHILD,
    parentId,
    childId,
  };
}

Reducer将childId添加到parentId对象的childIds下。因此，addChild('node1', 'node2')处于这种状态：

{
    nodes: {
        node1: { childIds: ['node2'], },
        node2: { childIds: [], },
    },
    selectedNode: 'node1',
}

到目前为止很好。

我想做的是在操作创建者中将parentId参数设为可选。我希望逻辑可以自动将parentId默认为商店中的selectedNode值（如果未将其指定给操作创建者）。

从商店默认值的最佳做法是什么？我能想到的选项：

使用Redux-thunk或类似的方法来访问我的动作创建者中的状态，然后在其中创建selectedNode值。我倾向于这种方法...除了扩大我的动作创建者的逻辑量之外，我看不到任何弊端。
扩展我的节点缩减器以覆盖该状态的更多区域，包括selectedNode进入其接收的状态。我不喜欢这样，因为它增加了reducer的复杂性，并将接口状态放入我的节点数据中。
使用mapStateToProps告诉我的组件有关selectedNode值的信息，因此，当它调用动作创建器时，它可以将其传递。我不喜欢这样做，因为这会导致我的组件在selectedNode发生更改时重新渲染（否则该组件不需要这样做）。

还有其他选择吗？我主要对最佳做法感兴趣，因为我认为这些方法中的任何一种都可以。

Answer 1

我建议您看看reduce-reducers。

Redux提供的众所周知的combineReducers()会并行运行化简器，如果您愿意的话，每个化简器只知道自己范围内的状态。 还可以使用其他的reducer配置。例如，您可以减少一个reducers数组，每个均以 series 运行，这意味着每个将获得一个从其前体重新计算的状态对象，用于计算它将继续传递的新状态。

在您的情况下，这将使您的减速器在减少selectedNode动作的同时了解ADD_CHILD。如果未在操作中设置parentId，则reducer可以默认为selectedNode。您只需要确保更改selectedNode的化简器运行一个处理ADD_CHILD的上游。

Redux文档Redux docs: sharing-data-between-slice-reducers中用一种很好的方式（带有示例）对此进行了介绍。

使用此模式将使您避免重击，保持简单的动作创建者，仍然具有简单的组件选择器，将状态逻辑保留在它所属的化简器中，并仍然使化简器纯净。尝试过您提到的大多数其他模式后，我建议采用这种方法。

祝你好运！

在Action Creator中从Redux商店获取状态的最佳方法

1 个答案: