Redux学习笔记

(つД｀)･ﾟ･ 梳理一下Redux的知识点

1. 入门

首先,Redux 是什么?

Redux中文文档中的解释是:

Redux 是 JavaScript 状态容器，提供可预测化的状态管理。

首先,要了解Redux的作用,我们需要先了解React中的state 一一一>React官网中State的文档

2. 基础概念

Redux三大概念

1. action:描述如何改变state
2. reducer:根据action执行改变state的动作
3. store:管理state和reducer的状态机

store的职责:

维持应用的 state；
1.提供 getState() 方法获取 state；
2.提供 dispatch(action) 方法更新state；
3.通过 subscribe(listener) 注册监听器; 通过 subscribe(listener)
4.返回的函数注销监听器。

connect:

// 用于指定如何把当前 Redux store state 映射到展示组件的 props 中。
const mapStateToProps = (state, ownProps) => {
  return {
    active: ownProps.filter === state.visibilityFilter
  }
}

//接收 dispatch() 方法并返回期望注入到展示组件的 props 中的回调方法。
const mapDispatchToProps = (dispatch, ownProps) => {
  return {
    onClick: () => {
      dispatch(setVisibilityFilter(ownProps.filter))
    }
  }
}

// todoList是展示组件名
const VisibleTodoList = connect(mapStateToProps,mapDispatchToProps)(todoList);

export default VisibleTodoList;

其中:
mapStateToProps() 函数用于指定如何把当前 Redux store state 映射到展示组件的 props 中。
mapDispatchToProps() 方法接收 dispatch() 方法并返回期望注入到展示组件的 props 中的回调方法。