redux的用法详解

简介:Redux

redux是react中进行state状态管理的JS库（并不是react插件），一般是管理多个组件中共享数据状态。这个是和Vuex是一样的。

它是将一些共享数据存放到store（仓库里），在这个仓库里有许多reducer（reducer里存放了共享数据）然后我们在组件中通过action（一定的方法或者逻辑）进行到store里找到对应的reducer进行操作我们的数据。下面给大家展示一个会更清晰点。

redux流程图：

---

redux中三个比较重要的知识点：reducer、store、action

1：reducer是我们处理状态的一个函数，它接受两个参数state和action

   1.1:state就是你所需要的数据，一般直接回初始化。

   1.2:action就是我们的触发reducer中对应参数的方式，我们通过action.type进行判断，从而操作对应的数据逻辑。

reducer具体知识如图示：

2:store是存放reducer的仓库，我们通过创建store,然后将reducerc作为参数传递，这样我们的reducer中数据就与store连接了。

具体操作如图

3:action是我们通过dispath方式然后根据我们传递的类型通过store知道我们对应的reducer方法，最后操作我们的业务逻辑。

注意：上述图中的<TestStore>是我定义组件。

subscribe()方法是监听每次state修改情况,当数据一改变，就会触发这个方法我们可以用store.getState()拿到最新的值。

注意：上面我重新定义了一个render()，然后通过subscribe(render)调用，这样做的原因是，虽然我们将redcers里的数据改变可，但是页面并没有重新渲染，所以我们得不到新的数据，所以我通过subscribe这个方法，重新渲染页面，当然这个方法在真正做项目中可能不适用。后续我会更新react-redux知识点来解决。

redux基本的知识点就怎这么多，是不是很简单。（偷偷告诉你，后面有头疼的，哈哈）

结尾：

---

分享：不管生活怎样让你烦躁，你做的只需一件事，那就是静心。