Flux

Flux应用主要包括三部分:dispatcher、store和views(React components)
千万不要和MVC(model-View-Controller)搞混(MVC还没有搞懂)。
Flux使用单向的数据流动来避开MVC.
Action -> Dispatcher -> Store -> View

整个流程如下:

  • 首先要有 action,通过定义一些 action creator 方法根据需要创建 Action 提供给 dispatcher
  • View 层通过用户交互(比如 onClick)会触发 Action
  • Dispatcher 会分发触发的 Action 给所有注册的 Store 的回调函数
  • Store 回调函数根据接收的 Action 更新自身数据之后会触发一个 change 事件通知 View 数据更改了
  • View 会监听这个 change 事件,拿到对应的新数据并调用 setState 更新组件 UI
所有的状态都由 Store 来维护,通过 Action 传递数据,构成了如上所述的单向数据流循环,所以应用中的各部分分工就相当明确,高度解耦了。
有一些flux的实现用了events模块,用来监听store的change事件,注册的监听函数在改变之前执行,可以在改变store之后使用EventEmitter.emit('change')让侦听函数在数据改变之后执行,比如组件更新(改变state)(?)