understand flux
是一种规范
action -> dispatch -> store -> view
redux vs vuex
同步数据更改
| flux | redux | vuex |
|---|---|---|
| action | dispatch | commit |
| dispatch | action | |
| store | reducer | mutation |
| view | 修改state | 修改state |
异步数据更改
| flux | redux | vuex |
|---|---|---|
| action | dispatch | dispatch |
| dispatch | action creater do dispatch | action |
| store | mutation | reducer |
| view | 修改state | 修改state |
三大原则
单一数据源
只有一个state
readonly state
state是只读是，想要修改只能从action 中修改
纯函数
reducer是纯函数即
- 不会更改入参
- 不会产生副作用
流程
action creater ---action--> dispatcher
dispatcher --> dispatche(action) -->reducer
reducer --nextStore--> view
store
定义：数据中心
方法：
- getState():获取当前state
- dispatch(action): dispatch action
- subscribe(listener): listener 一般是view
action
定义：触发的更新行为
包括
- actionType:类型
- payload: 数据载荷
reducer
定义：更新函数
（previousState, action）=> newState
ActionCreater returns action to dispatcher
dispatcher use store.dispatch(action) to reducer
reducer interval reducer(state, action) return state = newState
