关于redux
react将dom解耦,不用直接操作dom,使用了状态机制,当状态改变时视图就会相应更新。我们知道在react中,父组件可以将一些状态传递给子组件,让子组件的视图相应更新,这时我们会发现,只有有关联的组件才可以依次传递,那些没有父组件与子组件关系的组件,这些组件之间的某些状态是共享的,这时就需要redux了。
redux的主要设计思想:1)web应用是一个状态机,视图与状态是一一对应的 2)所有的状态都保存在一个对象里
redux包含两个步骤,发起Action和产生新state的reducer
Action的函数可以是自己写的一个请求后台数据的函数,也可以使用react-actions中的createAction,与后台无交互,只是传入更新的state
Reducer的函数接收Action传入的state,通过对state操作返回新的state,在需要该state的组件使用该reducer更新state
redux的设计思想之一就是所有的数据都在一个对象里,那么当reducer过于繁多时,就会导致代码难于维护,所以我们可以拆分成几个小的reducer,最后将这些reducer合并成大的reducer,redux提供了combineReducers函数可以将子reducer合并成一个state对象
关于redux的更多相关文章
- RxJS + Redux + React = Amazing!(译一)
今天,我将Youtube上的<RxJS + Redux + React = Amazing!>翻译(+机译)了下来,以供国内的同学学习,英文听力好的同学可以直接看原版视频: https:/ ...
- 通过一个demo了解Redux
TodoList小demo 效果展示 项目地址 (单向)数据流 数据流是我们的行为与响应的抽象:使用数据流能帮我们明确了行为对应的响应,这和react的状态可预测的思想是不谋而合的. 常见的数据流框架 ...
- RxJS + Redux + React = Amazing!(译二)
今天,我将Youtube上的<RxJS + Redux + React = Amazing!>的后半部分翻译(+机译)了下来,以供国内的同学学习,英文听力好的同学可以直接看原版视频: ht ...
- redux学习
redux学习: 1.应用只有一个store,用于保存整个应用的所有的状态数据信息,即state,一个state对应一个页面的所需信息 注意:他只负责保存state,接收action, 从store. ...
- webpack+react+redux+es6开发模式
一.预备知识 node, npm, react, redux, es6, webpack 二.学习资源 ECMAScript 6入门 React和Redux的连接react-redux Redux 入 ...
- Redux初见
说到redux可能我们都先知道了react,但我发现,关于react相关的学习资料很多,也有各种各样的种类,但是关于redux简单易懂的资料却比较少. 这里记录一下自己的学习理解,希望可以简洁易懂,入 ...
- react+redux教程(八)连接数据库的redux程序
前面所有的教程都是解读官方的示例代码,是时候我们自己写个连接数据库的redux程序了! 例子 这个例子代码,是我自己写的程序,一个非常简单的todo,但是包含了redux插件的用法,中间件的用法,连接 ...
- react+redux教程(七)自定义redux中间件
今天,我们要讲解的是自定义redux中间件这个知识点.本节内容非常抽象,特别是中间件的定义原理,那多层的函数嵌套和串联,需要极强逻辑思维能力才能完全消化吸收.不过我会多罗嗦几句,所以不用担心. 例子 ...
- react+redux教程(六)redux服务端渲染流程
今天,我们要讲解的是react+redux服务端渲染.个人认为,react击败angular的真正“杀手锏”就是服务端渲染.我们为什么要实现服务端渲染,主要是为了SEO. 例子 例子仍然是官方的计数器 ...
- react+redux教程(五)异步、单一state树结构、componentWillReceiveProps
今天,我们要讲解的是异步.单一state树结构.componentWillReceiveProps这三个知识点. 例子 这个例子是官方的例子,主要是从Reddit中请求新闻列表来显示,可以切换reac ...
随机推荐
- 用switch函数根据选择不同的radio出现不同的视图
html代码: <!DOCTYPE html> <html> <head> <title></title> <style type=& ...
- struts2中s:select标签的使用
1.第一个例子: <s:select list="{'aa','bb','cc'}" theme="simple" headerKey="00& ...
- 【HDU5126】 stars k-d树
题目大意:有$m$个操作,分两种:在指定三维坐标内加入一个点,询问指定空间内点的数量. 其中$m≤5*10^{4},1≤x,y,z≤10^9$ 这题几乎就是裸的$k-d$树啊.我们动态维护一棵$k-d ...
- iOS 枚举讲解
枚举增强程序的可读性,用法上还是需要注意的 1.C语言的写法 enum XMPPReconnectFlags { kShouldReconnect = 1 << 0, // If set, ...
- 获取设备信息——获取客户端ip地址和mac地址
1.获取本地IP(有可能是 内网IP,192.168.xxx.xxx) /** * 获取本地IP * * @return */ public static String getLocalIpAddre ...
- windows本地调试安装hadoop(idea) : ERROR util.Shell: Failed to locate the winutils binary in the hadoop binary path
1,本地安装hadoop https://mirrors.tuna.tsinghua.edu.cn/apache/hadoop/common/ 下载hadoop对应版本 (我本意是想下载hadoop ...
- PL/SQL程序设计
1 PL/SQL简介 1 什么是PL/SQL? PL/SQL是 Procedure Language & Structured Query Language 的缩写.PL/SQL是对SQL语言 ...
- pygame游戏开发-简介
转自白月黑羽Python教程:http://www.python3.vip/doc/tutorial/python/game/ 推荐对Python有兴趣的童鞋可以关注去看看,教程语言平实,简单易懂. ...
- 编写dimgr脚本学到的知识及技巧
编写dimgr是为了管理手机上的镜像,在此总结下过程中学到的知识及技巧(不讨论具体用法). 参数处理 以往处理脚本参数直接用循环加判断语句,若是脚本只有简单参数,这无疑是简便可行的方法.但当需要处理复 ...
- 11-hdfs-NameNode-HA-wtihQJM解决单点故障问题
在hdfs中, NN只有一个, 但其中保存的数据尤其重要, 所以需要将元数据保存, 其中源数据有2个形式, fsimage 和 edit文件, 最简单的解决方法就是复制fsimage, 并在文件修改时 ...