redux
强调的是，redux 与 react 并没有直接关系，它是一个独立的 JavaScript 状态管理库（数据），如果我们希望中 React 中使用 Redux，需要先安装 react-redux
知识点
- 状态管理器
- state 对象
- reducer 纯函数
- store 对象
- action 对象
- combineReducers 方法
- react-redux
- provider 组件
- connect 方法
- Redux DevTools extension 工具
- 中间件 - middleware
- redux-chunk
状态（数据）管理
前端应用越来越复杂，要管理和维护的数据也越来越多，为了有效的管理和维护应用中的各种数据，我们必须有一种强大而有效的
数据管理机制，也称为状态管理机制，Redux 就是解决该问题的
Redux
Redux 是一个独立的 JavaScript 状态管理库，与非 React 内容之一
https://www.bootcdn.cn/redux/
核心概念
理解 Redux 核心几个概念与它们之间的关系
- state
- reducer
- store
- action
state 对象
通常我们会把应用中的数据存储到一个对象树（Object Tree） 中进行统一管理，我们把这个对象树称为：state
state 是只读的
这里需要注意的是，为了保证数据状态的可维护和测试，不推荐直接修改 state 中的原数据
通过纯函数修改 state
什么是纯函数？
纯函数 （Reducer）
1. 相同的输入永远返回相同的输出
2. 不修改函数的输入值
3. 不依赖外部环境状态
4. 无任何副作用
使用纯函数的好处 （特别单纯，里面没有可变的东西）
1. 便于测试
2. 有利重构
Reducer 函数
上面的 todo 函数就是 Reducer 函数
1. 第一个参数是原 state 对象
2. Reducer 函数不能修改原 state，而应该返回一个新的 state
3. 第二参数是一个 action 对象，包含要执行的操作和数据
4. 如果没有操作匹配，则返回原 state 对象
action 对象
我们对 state 的修改是通过 reducer 纯函数来进行的，同时通过传入的 action 来执行具体的操作，action 是一个对象
- type 属性 : 表示要进行操作的动作类型，增删改查……
- payload属性 : 操作 state 的同时传入的数据
但是这里需要注意的是，我们不直接去调用 Reducer 函数，而是通过 Store 对象提供的 dispatch 方法来调用
Store 对象
为了对 state，Reducer，action 进行统一管理和维护，我们需要创建一个 Store 对象
Redux.createStore 方法
let store = Redux.createStore((state, action) => {
// ...
}, []);
todo
用户操作数据的 reducer 函数
[ ]
初始化的 state
我们也可以使用 es6 的函数参数默认值来对 state 进行初始化
let store = Redux.createStore( (state = [], action) => {
// ...
} )
getState() 方法
通过 getState 方法，可以获取 Store 中的 state
dispatch() 方法
通过 dispatch 方法，可以提交更改，相当于打补丁，可以对store里的数据进行修改
action 创建函数
action 是一个对象，用来在 dispatch 的时候传递动作和数据，我们在实际业务中可能会中许多不同的地方进行同样的操作，
这个时候，我们可以创建一个函数用来生成（返回）action
subscribe() 方法 （可以用于react监听）
可以通过 subscribe 方法注册监听器（类似事件），每次 dispatch action 的时候都会执行监听函数，该方法返回一个函数，
通过该函数可以取消当前监听器
Redux 工作流
Reducers 分拆与融合
当一个应用比较复杂的时候，状态数据也会比较多，如果所有状态都是通过一个 Reducer 来进行修改的话，那么这个 Reducer
就会变得特别复杂。这个时候，我们就会对这个 Reducer 进行必要的拆分
我们把上面的 users、items、cart 进行分拆
combineReducers 方法
该方法的作用是可以把多个 reducer 函数合并成一个 reducer
网友评论