让商店倾听另一家商店的变化

Question

我有一个包含 2 个商店的 Flux 应用程序：ACCOUNT-STORE 和 CLIENT-STORE。

目前，该应用程序允许用户针对特定国家/地区进行过滤，并且整个过滤逻辑已在每个商店中实现（因为帐户数据和客户数据都必须按国家/地区过滤）。所以两者都存储： 1- 收听组件触发的 SELECT_COUNTRY 动作 2- 创建一个过滤函数，只保留选定的国家 3-将该函数应用于他们的数据

由于过滤器的数量会增加，我想知道是否可以将步骤 1 和 2 移动到仅管理过滤器的第三个商店：FILTER-STORE.

现在 FILTER-STORE 监听 SELECT_COUNTRY 并创建过滤器函数，但我找不到让 ACCOUNT-STORE 和 CLIENT-STORE 监听并对变化做出反应的最佳实践FILTER-STORE.

在FILTER-STORE的AppDispatcher.register中，我尝试在创建过滤函数后调用另一个动作：

switch (action.actionType) {
    case AppConstants.SELECT_ACCOUNT:
        updateAccountFilter(action.data);
        AppActions.stfil_selectAccount(
            FilterStore.getAccountFilter()
        );
        break;

我的计划是让 ACCOUNT-STORE 和 CLIENT-STORE 监听这个动作并使用它的负载。但是我陷入了错误信息：

Invariant Violation: Dispatch.dispatch(...): Cannot dispatch in the middle of a dispatch.

所以也许还有另一种方法？是否可以让 ACCOUNT-STORE 和 CLIENT-STORE 听 FILTER-STORE 就像我的组件听商店一样？

谢谢

Answer 1

您尝试做的事情违背了 Flux 单向数据流架构，here 解释道。 Stores 不应该为自己发出变化来监听，它应该只监听来自组件的动作并且也向组件发出变化。

如果你想 DRY 你的过滤器逻辑，你应该创建一个相应的 FilterActionCreator 来处理调度 SELECT_ACCOUNT 和其他操作。您可以在这个内容广泛的 answer.

中阅读更多相关信息

这将使您的逻辑保持干爽并确保您的流程安全。

让商店倾听另一家商店的变化

Make stores listen to change in another store

flux

reactjs