React学习笔记（2）redux

store 是核心 其中包含了state ，state的结构和内容决定了UI的样子，UI层可以去触发action（动作），每一个action指代一个state更改为另外一个状态，action会发送到reducer，reducer根据action中的描述将store中的state修改，从而我们的到新的state，新的state就会得到新的ui，如此往复，这就是redux中的数据流 

4-2 定义state 就是将原来那种模式的state 集中管理全部放到一个文件中 

4-3要使用Action需要使用store提供的dispatch方法将Action发送出去 

action其实是一个JSON对象，但是一般都会使用action Creator这个函数 返回一个action

Reducer其实是一个函数reducer()，这个函数接收当前状态的state和action这两个参数

根据state和action进行计算从而得到新的state 

可以把reducer理解为action的解析器 action描述了需要如何去修改一个state，而reducer落实到代码层面，对state 进行真正的修改

注意redux中的state是不可变的，reducer修改state并不能在原有的state上修改而是需要返回一个新的state对象

es6  对象扩展语法 创建一个新的state

注意 当启动应用时 redux中的state初始值是undfiend（reducer中，所以需要先定义一个初始值

常见的拆分有根据state 但是对于大型项目并不适用 

 

 

store是粘合剂是核心 它将redux中的各种概念粘合在一起，创建store需要redux提供的API createStore（），createStore它接收 reducer作为参数，共同创建出store这个对象，同时store这个对象提供了dispatch这个API，可以让我们通过dispatch函数来发送action，同时store中提供了getState（）这个API可以获得store中全局保存的state，同时可以通过subscribe订阅state的全局变化 

mapStateToProps 方法将 redux中的state映射到react中的props上

mapDispatchToProps 将 redux中将要使用的方法 映射到react中的props上

这样组件就可以通过propos上的方法调用相应的redux中的action方法

我的项目中的index.js相当于容器型组件和组件的结合

老师的项目中分成了两类 一类是展示型组件 就是components文件夹下的组件，另一类是容器型组件和state有关系的，放到了container文件夹下 ，比如AddTodoContainer组件，利用react-redux

 

提供的connect高阶组件 实现连接

我的项目中 这两个合并在☝️文件中 就是每个组件的入口文件 比如 canvas_root文件夹下canvas文件夹下的index.js这个文件 

redux-thunk 处理异步action的中间件