编排多个动作

Question

我不清楚如何在Redux中协调多个顺序动作。例如，我有一个应用程序，该应用程序的左侧有一个“摘要”面板，右侧是一个“ CRUD”面板。用户CRUD之后，我希望该应用程序自动更新摘要。我还希望能够独立地刷新摘要和CRUD。换句话说，我不希望CRUD操作必须了解摘要或任何其他将来的下游后续操作（反之亦然）。有没有使我的动作创建者不了解其他动作的最佳实践来协调这一工作？

例如，这是（实体）动作创建器，用于清除实体集合（CRUD动作）。正确，现在它与fetchSummary()调度紧密耦合。

export function clearCollection(collection) {
    return function(dispatch) {
        dispatch(requestCollectionClear(collection));

        return doClearCollection(collection)
            .then(function(coll) { 
                dispatch(receiveCollectionCleared(coll))
            })
            .then(function() {
                dispatch(fetchSummary()); // <-- How do I chain actions without tight coupling?
            });
            // TODO: .catch()
    }
}

在此处requestCollectionClear()启动异步操作，并且fetchSummary()是工作流中后续步骤的操作创建者。什么是分离的最佳模式fetchSummary()，从clearCollection()去耦他们使用彼此独立的？

Answer 1

为了重申您的问题，您希望 CRUD 操作在完成后获取摘要，但您不希望操作必须了解摘要。

最好的方法（我能想到的）是在您所在的州有一个stale标志（或您想要的任何名称）作为摘要。在化简器中，将过时标志标记为true从所有 CRUD 操作获得的每个接收操作的摘要。这样，操作不会耦合，但可以保证顺序更新。因此，摘要正在监听所有操作。

下一步是检查stale摘要容器中的标志。假设您正在使用 React，我认为componentWillUpdate（https://facebook.github.io/react/docs/component-specs.html#updating-componentwillupdate）会有用。然后您可以fetchSummary在那里触发操作。您可能还想在初始渲染时执行此操作componentDidMount（https://facebook.github.io/react/docs/component-specs.html#mounting-componentdidmount）。