React学习(2)——action,reducer
action creator
是一个函数,格式如下:
var actionCreator = function() {
// 构建一个 action 并返回它
return {
type: 'AN_ACTION'
}
}
action
是一个拥有 type 属性的对象,用来描述发生了什么,然后按 type 决定如何处理 action。
举一个例子,获取数据是一个 action,一个点击是一个 action,一个 input 变化也是一个 action 等等。
下面是一些 action 的示例:
{ type: 'ADD_TODO', text: 'Go to swimming pool' }
{ type: 'TOGGLE_TODO', index: 1 }
{ type: 'SET_VISIBILITY_FILTER', filter: 'SHOW_ALL' }
reducer
为了把 action 和 state 串起来,开发一些函数,这就是 reducer。
Reducer 函数只是一个纯函数,它接收应用程序的当前状态以及发生的 action,然后返回修改后的新状态(或者有人称之为归并后的状态)。
reducer 只是一个接收 state 和 action,并返回新的 state 的函数。
对于大的应用来说,不大可能仅仅只写一个这样的函数,所以我们编写很多小函数来分别管理 state 的一部分:
这里有个常见模式:在 reducer 里用 switch 来响应对应的 action 。用 switch 的时候, **永远** 不要忘记放个 “default” 来返回 “state”,
参考:https://github.com/react-guide/redux-tutorial-cn
React学习(2)——action,reducer的更多相关文章
- React学习资料
以下是我整理的React学习资料,包括:React基础.Redux.reat-router, redux middleware, higher order components, React验证等, ...
- react学习一篇就够了
webstrom自动格式化代码 命令 js框架 MVC 安装 npm install create-react-app -g 生成项目(项目名npm发包包命名规范 /^[a-z0-9_-]$/) cr ...
- AntDesign(React)学习-1 创建环境
目录: AntDesign(React)学习-15 组件定义.connect.interface AntDesign(React)学习-14 使用UMI提供的antd模板 AntDesign(Reac ...
- React学习笔记-1-什么是react,react环境搭建以及第一个react实例
什么是react?react的官方网站:https://facebook.github.io/react/下图这个就是就是react的标志,非常巧合的是他和我们的github的编辑器Atom非常相似. ...
- react学习小结(生命周期- 实例化时期 - 存在期- 销毁时期)
react学习小结 本文是我学习react的阶段性小结,如果看官你是react资深玩家,那么还请就此打住移步他处,如果你想给一些建议和指导,那么还请轻拍~ 目前团队内对react的使用非常普遍,之 ...
- React学习笔记(一) 基础知识
现在最热门的前端框架有AngularJS.React.Bootstrap等.自从接触了ReactJS,ReactJs的虚拟DOM(Virtual DOM)和组件化的开发深深的吸引了我. React的基 ...
- React学习系列
React学习系列 系列学习react 翻译地址 https://scotch.io/tutorials/learning-react-getting-started-and-concepts 我是初 ...
- react学习笔记1--基础知识
什么是react A JAVASCRIPT LIBRARY FOR BUILDING USER INTERFACES[React是一个用于构建用户界面的JavaScript库.] React之所以快, ...
- react 学习与使用记录
相关技术:webpack+react+react-router+redux+immutable 郭永峰react学习指南 1.git bash--windows命令行工具 --教程 下载地址 2. i ...
- Struts2框架学习(二) Action
Struts2框架学习(二) Action Struts2框架中的Action类是一个单独的javabean对象.不像Struts1中还要去继承HttpServlet,耦合度减小了. 1,流程 拦截器 ...
随机推荐
- ZOJ 3204 Connect them 继续MST
http://acm.zju.edu.cn/onlinejudge/showProblem.do?problemId=3367 题目大意: 让你求最小生成树,并且按照字典序输出哪些点连接.无解输出-1 ...
- 撸代码--类QQ聊天实现(基于linux 管道 信号 共享内存)
一:任务描写叙述 A,B两个进程通过管道通信,像曾经的互相聊天一样,然后A进程每次接收到的数据通过A1进程显示(一个新进程,用于显示A接收到的信息),A和A1间的数据传递採用共享内存,相应的有一个B1 ...
- Loader之一:基本原理 分类: H1_ANDROID 2013-11-16 10:29 1923人阅读 评论(0) 收藏
参考APIDEMO及http://developer.android.com/guide/components/loaders.html#app 1.Introduced in Android 3.0 ...
- 定位导致物化视图无法快速刷新的原因 分类: H2_ORACLE 2013-08-08 23:04 335人阅读 评论(0) 收藏
转载自:http://yangtingkun.itpub.net/post/468/13318 物化视图的快速刷新采用了增量的机制,在刷新时,只针对基表上发生变化的数据进行刷新.因此快速刷新是物化视图 ...
- Android 节日短信送祝福(UI篇:3-选择短信与发送短信的Activity的实现)
一.ChooseMsgActivity的实现 1.布局文件 <RelativeLayout xmlns:android="http://schemas.android.com/apk/ ...
- PatentTips - 在物联网中进行数据过滤的方法和装置
背景技术 [0001] 本发明涉及物联网,特别涉及在物联网进行数据过滤的方法和装置. [0002] 物联网是新一代信息技术的重要组成部分,特指物物相连的网络.具体地,物联网是指通过各种信息传感设备,如 ...
- [tmux] Customize tmux with tmux.conf
You can modify tmux's behavior with your tmux configuration file, .tmux.conf. You can use your tmux ...
- Java环境搭建若干问题
0.总体说明 本次搭建环境,为了偷懒,使用的是,阿里云镜像. 自带了Nginx.Tomcat.JDK等. 比较坑爹的是,虽然镜像带了很多安装好的软件,但是也有各种问题,比如它修改了tomc ...
- 【codeforces 758B】Blown Garland
time limit per test1 second memory limit per test256 megabytes inputstandard input outputstandard ou ...
- layer弹框在实际项目中的一些应用
官方介绍:layer至今仍作为layui的代表作,受众广泛并非偶然,而是这五年多的坚持,不断完善和维护.不断建设和提升社区服务,使得猿们纷纷自发传播,乃至于成为今天的Layui最强劲的源动力.目前,l ...