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,流程 拦截器 ...
随机推荐
- 嵌入式/X86下linux系统死机及内存优化
一. CPU 过高或死锁导致系统卡死 1. CPU占用过高 (1)开线程太多导致CPU占用过高,系统卡死 解决:优化应用层业务逻辑,有些业务不必开线程就不开 (2)频繁清缓存导致读spi-flash ...
- HTTP请求头与响应头
http://m.blog.csdn.net/article/details?id=48918857 本篇文章中,将学习一下HTTP请求头与响应头的知识. 一.HTTP头引入: 正确的设置HTTP头部 ...
- $.getJSON 跨域
//支持跨域 $.getJSON(url + '&callback=?', function(res) { if (res.status === 0) { console.log(res.re ...
- Docker CE for Windows安装使用
原文:Docker CE for Windows安装使用 官网下载并安装Docker CE for Windows IDEA连接Docker Docker一些常用命令 Docker for windo ...
- 使用Html5开发Android和iOS应用:HBuilder、Html5Plus、MUI
活动主题:五一巨献,问答有礼,105QB送给IT互联网界的劳动人民活动时间:4月30日晚上10点~5月2日晚上10点网址: http://ask.jiutianniao.com 2014年的时候,就 ...
- PHP CodeBase: 判断用户是否手机访问
随着移动设备的普及,网站也会迎来越来越多移动设备的访问.用适应PC的页面,很多时候对手机用户不友好,那么有些时候,我们需要判断用户是否用手机访问,如果是手机的话,就跳转到指定的手机友好页面.这里就介绍 ...
- 微信小程序从零开始开发步骤(三)
上一章节,我们分享了如何创建一个新的页面和设置页面的标题,这一章我们来聊聊底部导航栏是如何实现的.即点击底部的导航,会实现不同对应页面之间的切换. 我们先来看个我们要实现的底部导航栏的效果图:(三个导 ...
- 如何使用Name对象,包括WorkspaceNames和DatasetNames
转自chanyinhelv原文 如何使用Name对象,包括WorkspaceNames和DatasetNames 第一原文链接 该博主还有很多有关arcgis二次开发的不错的文章. 如何使用Name对 ...
- Oauth入门学习
在一些网站总是看到调用其他网站的信息的实例,比如在人人网中导入MSN联系人,在Facebook中导入gmail,yahoo mail好友,第三方网站不需要总知道你的密码,对于应用的授权完全交给你自己, ...
- sqlplus中登陆账户用@加上数据库sid
sqlplus连接数据库时除了先输入用户名再输入密码的方式还有一种直接输入方式,而且使用@sid区分数据库,在有多个数据库时可方便区分 connect sys/sysdb@oraclesid as s ...