一、安装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。

  

使用redux开发的简单步骤的更多相关文章

  1. 使用react-redux开发的简单步骤

    一.安装相关包 npm install redux react-redux --save 二.根据具体情形创建模块文件 Store.js.Reducer.js.Actions.js Store.js的 ...

  2. Android组件化开发的简单应用

    组件化开发的主要步骤: 一.新建Modules 1.新建Project,作为应用的主Module. 2.新建Module:"Common",类型选择"Android Li ...

  3. [.NET] 使用 Senparc.Weixin 接入微信公众号开发:简单实现自动回复

    使用 Senparc.Weixin 接入微信公众号开发:简单实现自动回复 目录 一.前提 二.基本配置信息简析 三.配置服务器地址(URL) 四.请求处理 一.前提 先申请微信公众号的授权,找到或配置 ...

  4. 嵌入式ARM开发板学习方法步骤

    嵌入式开发就是指在嵌入式操作系统下进行开发,一般常用的系统有linux,android. 平台:Cortex-A9开发板 嵌入式技术学习如何入手,从何学起呢, 以下内容简单介绍嵌入式开发的学习步骤及如 ...

  5. 搭建vue开发环境的步骤,六步完成

    搭建vue开发环境的步骤,其实也挺简单的,之前这环境的配置也困扰着我一:在搭建vue的开发环境之前,一定一定要先下载node.js,vue的运行是要依赖于node的npm的管理工具来实现,下载地址:h ...

  6. django学习-11.开发一个简单的醉得意菜单和人均支付金额查询页面

    1.前言 刚好最近跟技术部门的[产品人员+UI人员+测试人员],组成了一桌可以去公司楼下醉得意餐厅吃饭的小team. 所以为了实现这些主要点餐功能: 提高每天中午点餐效率,把点餐时间由20分钟优化为1 ...

  7. 如何开发一个简单的HTML5 Canvas 小游戏

    原文:How to make a simple HTML5 Canvas game 想要快速上手HTML5 Canvas小游戏开发?下面通过一个例子来进行手把手教学.(如果你怀疑我的资历, A Wiz ...

  8. Java开发工具安装步骤内容如下

    Java开发工具安装步骤内容如下 安装 开发工具 STS 链接下载网址 eclipse 链接下载网址 JDK安装 jdk链接下载地址 Marven环境 marven链接下载地址 Tomcat tomc ...

  9. 重新想象 Windows 8 Store Apps (64) - 后台任务: 开发一个简单的后台任务

    [源码下载] 重新想象 Windows 8 Store Apps (64) - 后台任务: 开发一个简单的后台任务 作者:webabcd 介绍重新想象 Windows 8 Store Apps 之 后 ...

随机推荐

  1. CentOS 7禁止IPv6

    如何在CentOS 7中禁止IPv6 https://Linux.cn/article-4935-1.html 最近,我的一位朋友问我该如何禁止IPv6.在搜索了一番之后,我找到了下面的方案.下面就是 ...

  2. [springBoot系列]--spring-boot-devtools在Idea中热部署方法

    1 pom.xml文件 注:热部署功能spring-boot-1.3开始有的 <!--添加依赖--> <dependency> <groupId>org.sprin ...

  3. 深入理解JavaScript系列(50):Function模式(下篇)

    介绍 本篇我们介绍的一些模式称为初始化模式和性能模式,主要是用在初始化以及提高性能方面,一些模式之前已经提到过,这里只是做一下总结. 立即执行的函数 在本系列第4篇的<立即调用的函数表达式> ...

  4. Firebird3 embedded connection

    Firebird3 的嵌入式连接和以前的版本不同,官方也不再单独发布嵌入式版本了,因为嵌入式版本已经包含在zip包里了. 具体只需要文件: fbclient.dll.ib_util.dll.icudt ...

  5. 常用软件下载开发环境七牛镜像Java、Node、Mongo

    [jdk1.8] Linux:http://soft.yzeng.cc/jdk18/jdk-8u202-linux-x64.tar.gz Windows:http://soft.yzeng.cc/jd ...

  6. [android] 安卓自定义样式和主题

    简单练习自定义样式和主题,样式是加在View上,主题是加在Application或者Activity上 styles.xml <?xml version="1.0" enco ...

  7. [javaEE] jsp的九大隐式对象

    pageContext对象: 1.可以作为入口对象获取其他八大隐式对象的引用 1.1 getEXception获取exception隐世对象 1.2 getPage获取page对象 1.3 getRe ...

  8. java爬虫之入门基础

    相比于C#,java爬虫,python爬虫更为方便简要,首先呢,python的urllib2包提供了较为完整的访问网页文档的API,再者呢对于摘下来的文章,python的beautifulsoap提供 ...

  9. Tomcat源码(二):tomcat启动之前的初始化

    当tomcat启动的时候 首先会加载 org.apache.ctalina.startup.BootStrap类. 使用eclipse或idea启动tomcat其实就是在启动这个类的main方法 根据 ...

  10. 用图片替代cursor光标样式

    鼠标光标样式有限,可参考http://css-cursor.techstream.org/,自定义光标样式可用设置cursor:url('xxx.cur'),auto;.还有一种办法,就是用图片替代鼠 ...