Question

我试图绕过Flux，我实际上有一个人为的例子，但我对事件流程有点困惑。假设我定义了一个名为TestAction的动作。我的视图有一个发出该事件的onClick;

Dispatcher.dispatch(new TestAction(this.state.currentValue));

很好，它流向商店。到目前为止，非常好，我明白了。

现在，我的商店做了它所做的任何魔术，与服务器等交谈并自行更新。然后，由于某种原因，所有的例子都显示商店在这些方面做了一些事情;

Dispatcher.register((action: Action) => {
  if (action instanceof TestAction) {
    var text = (<TestAction>action).text;
    console.log('Store got: ', text);
    this._text = text + '_';
    this.emit(TestStore.TEST_EVENT, this._text);
  }
});

所以我想我的问题是，为什么它会触发相同的事件？是专门为调度员处理waitFor吗？它本身是否理解同一事件回来意味着什么？

Answer 1

每当发生事件（如点击）时，作为React组件的

Views都会发出action。

然后，这些操作使用utils/apis将数据提取/推送到服务器，然后使用此提取/推送数据作为有效负载通过dispatcher发送。

Dispatcher是向多个商店通知更新的中心机制，更新是与特定action type一起调度的有效负载。

存储特定类型action types的注册。每当调度程序发送有关该操作类型的更新时，存储将使用该数据自行更新，并发出更改事件，表示存储状态已更改。

Views订阅这些商店，每当商店发出更改事件时，视图会更新其商店并重新呈现自己。这是一整圈数据流。再次，当某个事件发生在视图上时，循环开始。

单向数据流 -

Views -> Action -> Dispatcher -> Stores -> Views

对于进一步的细节，这是一篇很好的文章 - https://medium.com/brigade-engineering/what-is-the-flux-application-architecture-b57ebca85b9e

来自商店的流量事件？

1 个答案: