Redux 是什么

Redux是一个专门用来做状态管理的JS库，不是react插件，但是更多被用在react中，管理React应用中多个组件共享的状态。

以前我们是数据在哪儿，管理的方法就在哪儿，小型的项目不使用状态管理插件的话是可以方便管理的。但是遇到大型项目，状态管理就变得非常麻烦。

redux集中式管理react应用中多个组件的共享状态

redux流程图

• 组件与redux进行交互
• store是redux中的核心对象，用于存储状态，从react Components中读状态（state）并显示
• Action使用dispatch(分发事件)通知Store对象更改状态
• Reducers函数（previousState,action）参数，返回newState给Store,Store再来setState。

下载依赖包

npm install --save redux

action

是一种行为，其中包含2个属性：

• type：标识属性，值为字符串，唯一，必要属性。
• XXX:数据属性，值的类型任意，可选属性。

const action = {
  type:"INCREMENT",
  data:1
}

Action Creator(创建Action的工厂函数)

const increment = (number) => ({  type:"INCREMENT",data: number})

reducer

根据老的state和action产生新的state的纯函数

export default function counter(state = 0, action) {
  switch (action.type) {
    case 'INCREMENT':
      return state + action.data
        case 'DECREMENT':
      return state - action.data
     default:
      return state
  }
}

返回一个新的状态，不能改变原来的状态，只能覆盖

store对象

• redux核心管理对象（状态（state）、reducer(老状态=>新状态)）
• 将state、action、reducer联系在一起的对象

核心方法

• 获取对象getState()
• 分发事件 dispatch(action)
• 订阅subscribe(listener)