FLUX

1. user operation, respond with Action.doSometing()

2. Dispacther.dispatch({...}) 

3. Dispatcher：Dispatcher.register(function(playload) {switch(actionType) {...}})

4. dispacther invoke public API to operate Store and emit a Change Event of Store

5. View listenTo store-Change

6. View re-get StoreData and then reRender

Flux-Flow

Talk is cheap,Show me the code

--  Linus Torvalds

Dispacther

“中央集线器”，管理数据流

向store分发action，是store callback的注册表

Stores

包含且唯一包含应用的状态和逻辑

Store向外部只提供Getter方法

公共API暴露给Dispatcher操作Store，除Dispatcher其他部分不直接操作Store

React Components

controller-views需要监听store广播的事件做出对应更新的view

store.getter，this.setState

View/Controller-View

Dispatcher提供的可以向store中触发分发的方法

Dispacther.dispatch(payload)

Action

Dispacther.WaitFor

dependencies

String dispacther.register

Dispacther.waitFor([tokens])

Superiority?

Unidirectional Data Flow Makes Things Easy

Thanks For Your Time

Q&A