使用redux开发的简单步骤
一、安装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开发的简单步骤的更多相关文章
- 使用react-redux开发的简单步骤
一.安装相关包 npm install redux react-redux --save 二.根据具体情形创建模块文件 Store.js.Reducer.js.Actions.js Store.js的 ...
- Android组件化开发的简单应用
组件化开发的主要步骤: 一.新建Modules 1.新建Project,作为应用的主Module. 2.新建Module:"Common",类型选择"Android Li ...
- [.NET] 使用 Senparc.Weixin 接入微信公众号开发:简单实现自动回复
使用 Senparc.Weixin 接入微信公众号开发:简单实现自动回复 目录 一.前提 二.基本配置信息简析 三.配置服务器地址(URL) 四.请求处理 一.前提 先申请微信公众号的授权,找到或配置 ...
- 嵌入式ARM开发板学习方法步骤
嵌入式开发就是指在嵌入式操作系统下进行开发,一般常用的系统有linux,android. 平台:Cortex-A9开发板 嵌入式技术学习如何入手,从何学起呢, 以下内容简单介绍嵌入式开发的学习步骤及如 ...
- 搭建vue开发环境的步骤,六步完成
搭建vue开发环境的步骤,其实也挺简单的,之前这环境的配置也困扰着我一:在搭建vue的开发环境之前,一定一定要先下载node.js,vue的运行是要依赖于node的npm的管理工具来实现,下载地址:h ...
- django学习-11.开发一个简单的醉得意菜单和人均支付金额查询页面
1.前言 刚好最近跟技术部门的[产品人员+UI人员+测试人员],组成了一桌可以去公司楼下醉得意餐厅吃饭的小team. 所以为了实现这些主要点餐功能: 提高每天中午点餐效率,把点餐时间由20分钟优化为1 ...
- 如何开发一个简单的HTML5 Canvas 小游戏
原文:How to make a simple HTML5 Canvas game 想要快速上手HTML5 Canvas小游戏开发?下面通过一个例子来进行手把手教学.(如果你怀疑我的资历, A Wiz ...
- Java开发工具安装步骤内容如下
Java开发工具安装步骤内容如下 安装 开发工具 STS 链接下载网址 eclipse 链接下载网址 JDK安装 jdk链接下载地址 Marven环境 marven链接下载地址 Tomcat tomc ...
- 重新想象 Windows 8 Store Apps (64) - 后台任务: 开发一个简单的后台任务
[源码下载] 重新想象 Windows 8 Store Apps (64) - 后台任务: 开发一个简单的后台任务 作者:webabcd 介绍重新想象 Windows 8 Store Apps 之 后 ...
随机推荐
- Java绘制图片并进行合成
以下代码可以生成六行两列的图片,代码改成了可以接受参数可循环的. package com.xgt.util; import com.sun.image.codec.jpeg.JPEGCodec; im ...
- ASP.NET Core中使用默认MVC路由
ASP.NET Core里Route这块的改动不大,只是一些用法上有了调整,提供了一些更加简洁的语法. 而对于自定义路由的支持当然也是没有问题的,这个功能应该是从MVC1.0版本就已经有这个功能. 先 ...
- NPOI 设置导出的excel内容样式
导出excel时,有时要根据需要加上一些样式,以上几种样式是我在项目中用到的 一.给单元格加背景色只需两步:一是创建单元格背景景色对象:二是给单元格绑定样式 //创建单元格背景颜色对象 HSSFPal ...
- 「Sdchr 的邀请赛」题解
骗个访问量.. A:取石子 将点 x 与点 x / prime 连边,那么这个图可以由指数之和的奇偶性来划分成一个二分图. 接下来考虑推广阶梯 NIM (或者这原本就是阶梯 NIM ?),必胜当且仅当 ...
- 深入理解JavaScript系列(43):设计模式之状态模式
介绍 状态模式(State)允许一个对象在其内部状态改变的时候改变它的行为,对象看起来似乎修改了它的类. 正文 举个例子,就比如我们平时在下载东西,通常就会有好几个状态,比如准备状态(ReadySta ...
- 判断网站域名是否被GFW(墙)过滤屏蔽了
GFW:Greate Firewall Of China中国防火长城: 描述: 1.今天所属的一个域名被告诉不能访问了,赶紧自己测试了一下,发现可以,然后对方试了下说是不行,然后仔细按对方说的一步步操 ...
- 清除SQL Server内存
数据库进行查询时,会缓存结果集,当查询结果过大时会出现内存爆满的情况,如果手动清除SQL所占用的内存呢,在网上搜索一下,把结果贴下面: --强制释放内存 Create procedure [dbo]. ...
- 使用多说评论&加网分享
多说评论: <div data-thread-key=" class="ds-thread"></div><script>var du ...
- [javaEE] 数据库连接池和动态代理
实现javax.sql.DataSource接口 实现Connection getConnection()方法 定义一个静态的成员属性LinkedList类型作为连接池,在静态代码块中初始化5条数据库 ...
- spring AOP Capability and Goals(面向方面编程功能和目标归纳)
原官方文档链接: https://docs.spring.io/spring/docs/5.1.6.RELEASE/spring-framework-reference/core.html#aop-i ...