Question

我在我的应用程序中使用react和flux，在我的应用程序中，我有两个组件：TreeView和TableView，它们是从两个不同的商店中提取的。

我想添加一个选项 - 当我点击TableView中的一行时，它将在我的TreeView中打开相关节点。

我的问题是：这两个组件应该如何相互通信？在AngularJS / Backbone中，我将使用Event Aggreator模式，并将广播一个事件，如 - ＆＃34; objectSelected＆＃34;用它的身份。

我应该如何做到这一点与flux体系结构做出反应 - 我认为使用flux方式 - 并创建一个动作，但随后我的商店将保存UI状态（哪些节点是开放的）我认为该组件（在这种情况下） TreeView）应该保存这个状态（而不是存储）。

那么反应中两个组件之间的谈话是否正确？

Answer 1

如果您不想使用助焊剂，那么您可以通过父组件将操作作为道具传递。

我使用的唯一通量实现是Fluxxor。使用fluxxor（可能是大多数flux实现），您可以同时拥有组件状态和存储状态。如果您的表和树总是要链接（同时打开或关闭），我认为将它保存在商店中是可以的。

您可以做类似的事情。

TableComponent = React.createClass({
  getInitialState: function() {
    return {
      //component specific state
    };
  },

  getStateFromFlux: function() {
    // flux store state
    return {
      appStore: this.getFlux().store('AppStore').state
    }
  },

  handleClick: function(tree) {
    this.getFlux().actions.appActions.toggleTree(tree);
  }
});

UI事件的Flux操作

1 个答案: