反應通量 如何將更改傳播到其他商店？

Question

我有一個非常簡單的結構：1個存儲區，2個組件（父級和子級，父級更像是一個控制器），動作和常量。 目前，我不進行任何API調用，所有數據都作為道具到達父組件。

流程很簡單。 在子組件上進行的任何更改都稱為父組件提供的回調。

在父組件中，它看起來像這樣：

_saveChangedFilters: function(filterObj, filterName) {
  Actions.setActiveFilters(filterObj, filterName);
}

動作：

setActiveFilters: function(filterObj, filterName) {
  AppDispatcher.dispatch({
    action: Constants.SET_ACTIVE_FILTER,
    filterObject: filterObj,
    filterName: filterName
  });
},

有貨：

this.dispatchToken = dispatcher.register(_.bind(function(payload) {
  switch (payload.action) {
    case Constants.MANUFACTURERS_FEED:
      this.setManufacturerStructure(payload.brands, payload.models, payload.facets);
      break;

    case Constants.SET_ACTIVE_FILTER:
      this.setActiveFilters(payload.filterObject, payload.filterName);
      this.emitChange();
      break;

    default:
  }
}, this));

如您所見，在調用存儲方法setActiveFilters我調用了emitChange 。 為此，我在主要組件中有一個偵聽器：

componentWillMount: function() {
  this.store.addChangeListener(this._onChange);
},

_onChange: function() {
  var newActiveFilters = this._getStoredActiveFilters();
  Actions.changePropagate(newActiveFilters);
  this.setState(newActiveFilters);
},

這是一個問題。 Actions.changePropagate引發錯誤：

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

據我了解，由於我在前一個操作完成之前分派了新操作，因此引發了錯誤。 所以我仍然在Actions.setActiveFilters並調用新的。

因此，如果我在子組件中進行了任何更改，我將調度一個動作，我的商店可以監聽該動作，這很好。 但是，如何添加功能，如果我在商店中有任何更改，我可以調度一個動作，該動作將在另一個商店中偵聽，而無需使用dispatcher.waitFor ？

Answer 1

您可以在多個商店中消費一項動作。

只需在每個相關存儲中重復使用您的case Constants.SET_ACTIVE_FILTER:並相應地消耗該存儲的有效負載即可。

作為通量如何工作的規則，“動作”從字面上應該是用戶所實施的“動作” 。 讓您的代碼自動調用動作創建者是一種極端情況，並且有點反模式。