使用redux开发的简单步骤

最新推荐文章于 2025-09-07 20:32:33 发布

转载最新推荐文章于 2025-09-07 20:32:33 发布 · 73 阅读

0 ·

CC 4.0 BY-SA版权

原文链接：http://www.cnblogs.com/DM428/p/8126245.html

文章标签：

#数据结构与算法

本文详细介绍了Redux的基本使用流程，包括安装Redux包、定义状态结构、创建reducer和store等步骤，并解释了如何在组件中使用store的主要方法。

一、安装redux包

npm install redux --save

二、根据APP数据结构或者后台请求的数据结构拟定state的大致结构。

　　可以把state写成一个对象字面量，放在reducer文件中，注释掉即可，当你觉得模糊混乱的时候就可以看一看这个state对象，然后就可以清楚state的具体构成了。

三、创建文件

　　reducer.js、 store.js

　　这两个文件，一个是用来写reducer的，另一个是用于生成store的。

　　在需要的时候，可以从这两个js模块引入，方便开发。

四、在reducer.js文件中写reducer函数。

　　可以使用combineReducers方法简化reducer函数，具体使用方法见之前的博客。

五、写store.js文件

　　引入需要使用的Middleware中间件，然后通过createStore方法生成store，最后作为模块引出。

六、在具体的组件文件中，如果要使用store，就从store.js引入。

　　store主要使用一下三个方法：

store.dispatch()
//用于dispatch action，传递action给reducer方法，处理修改state。
store.subscribe()
//用于给store注册监听（订阅）函数，被注册的函数在state发生改变时会被自动调用
store.getState()
//用于获取state，比如在组件中要使用state中的数据时就可以调用这个方法获取state。

转载于:https://www.cnblogs.com/DM428/p/8126245.html