Redux在React中的使用

首先使用cra脚手架安装react项目

create-react-app xx

1.基础用法

(1)首先在src下新建store目录结构

各文件结构暂时如下

在组件中使用redux的状态时，首先导入store，通过store.getState()可以拿到redux中的状态

点击按钮更改redux中num的状态

首先给按钮绑定点击事件

修改redux要在actionCreator中派发action给reducer，所以在actionCreator文件中如下

reducer中接受参数action,根据action的标识实行相关的逻辑改变redux中的状态

在组件中使用actionCreator的方法

这时我们发现当点击按钮时，数字并没有改变，这是因为组件没有接收redux中状态的改变，我们需要监听redux的改变

这就是基本的redux在react中的用法

2.redux用法进阶

首先在项目中安装react-redux

npm install --save react-redux

在APP外层包括Provider,并挂载属性store，provider在react-redux中引入,

将actionCreator文件更改为

在组件中使用时，设置的状态和监听都可以取消

注：reducer中必须是一个纯函数，里面不能有不纯粹的操作，同时不能对之前的状态进行更改，必须是同步的操作。新的状态与之前状态进行比较时时与引用地址进行比较，如果操作的新地址与原来地址一样，则不会渲染视图。（可用深拷贝）

由于时间关系，写的比较匆忙，如有错误望大家见谅，并提出宝贵意见