【问题标题】:Make stores listen to change in another store让商店倾听另一家商店的变化
【发布时间】:2015-09-04 00:20:12
【问题描述】:

我有一个带有 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 就像我的组件听商店一样?

谢谢

【问题讨论】:

标签: reactjs flux


【解决方案1】:

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

如果您想 DRY 您的过滤器逻辑,您应该创建一个相应的 FilterActionCreator 来处理调度 SELECT_ACCOUNT 和其他操作。您可以在这个广泛的answer 中了解更多信息。

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

【讨论】:

  • 非常感谢您的回答。我没有考虑采取行动,因为我认为最好让它们尽可能“干净”。但你是对的,它在这种情况下效果很好。
猜你喜欢
  • 2021-11-21
  • 2020-08-18
  • 2016-12-16
  • 2016-03-04
  • 1970-01-01
  • 2019-11-20
  • 1970-01-01
  • 2015-09-13
  • 1970-01-01
相关资源
最近更新 更多