redux

Redux的实现流程

用户页面行为触发一个Action，然后Store自动去调用Reducer,并传入两个参数，当前state和收到的action，Reducer会返回新的state，每当state更新之后，view会根据state触发重新渲染。

image.png

Redux设计和使用的三原则

store必须是唯一的

整个项目只允许有一个store，是整个应用的数据存储中心，集中大部分页面需求的状态数据

只有store能够改变自己的内容

Reducer必须是一个纯函数

纯函数：给固定的输入，就一定会有固定的输出，而且不会有任何副作用
state action给定时，return返回的也必定要是一个固定的，一旦一个函数中有setTimeout或日期相关的 就不是纯函数了。
reducer不能对传过来的参数进行修改。一旦修改 就会产生副作用。

Redux核心API

1、createStore 创建store

createStore .png
2、store.dispatch 派发action，把action传递给store
dispatch.png
3、store.getState 获取store 中的所有内容
this.state = store.getState();
4、store.subscribe 订阅store中的个改变 只要store发生改变，subscribe接收的回调函数就会执行。

Redux中action拆分

image.png

actionCreators统一管理action的js文件，通过export 导出一个回调函数，可在组件直接使用该函数，简化繁琐action定义。
actionTypes 定义action中的type，进行集中化管理，如果由于拼写错误导致代码报错可快速追踪。