---

title: 2019-10-01 react系列之一
date: 2019-10-01 22:39:48
tags:

• react
• frontend
  categories: technology

---

** 引言：** <Excerpt in index | 首页摘要>
家事国事天下事，事事关心!

<The rest of contents | 余下全文>

增加react—redux支持

add redux && react-redux support

npm install --save redux react-redux

代码上的改动

react_redux.png

解释下这些改动

这里我们看到一个connect方法，里边两个function，分别是mapStateToProps和mapDispatchToProps，Provider

1. mapStateToProps是一个函数。它的作用就是像它的名字那样，建立一个从（外部的）state对象到（UI 组件的）props对象的映射关系

2. mapDispatchToProps是connect函数的第二个参数，用来建立 UI 组件的参数到store.dispatch方法的映射。也就是说，它定义了哪些用户的操作应该当作 Action，传给 Store。它可以是一个函数，也可以是一个对象。

3. React-Redux 提供connect方法，用于从 UI 组件生成容器组件

4. React-Redux 提供Provider组件，可以让容器组件拿到state。

具体如何调用，找了张图，画的还可以：

react-redux-workflow.png