总结下Redux

  1. Redux 和 React 没有直接关系,它瞄准的目标是应用状态管理。
  2. 核心概念是 Map/Reduce 中的 Reduce。且 Reducer 的执行是同步,产生的 State 是 Immutable 的。
  3. 改变 State 只能通过向 Reducer dispatch actions 来完成。
  4. State 的不同字段,可以通过不同的 Reducers 来分别维护。combineReducers 负责组合这些 Reducers,前提是每个 Reducer 只能维护自己关心的字段。
  5. Action 对象只能是 Javascript Plain Object,但是通过在 store 上装载 middleware,则可以任意定义 action 对象的形式,反正会有特定的 middleware 负责将此 action 对象变为 Javascript Plain Object。可以以middleware 链条为集中点实现很多控制逻辑,例如 Log,Undo, ErrorHandler 等。
  6. Redux 仅仅专注于应用状态的维护,reducerdispatch/middleware 是两个常用扩展点、Higher-order Store 则仅针对需要扩展全部 Store 功能时使用。
  7. react-redux 是 Redux 针对 React/React-Native 的 Binding,connect/selector 是扩展点,负责将 store 中的状态添加到 React component 的 props 中。
  8. Redux 借用了很多函数式编程的思想,了解函数式编程会利于理解其实现原理,虽然使用它不需要了解很多函数式编程的概念。和 Flux 相比,Redux 的概念更精简、约定更严格、状态更确定、而是扩展却更灵活。
时间: 2024-10-12 20:10:47

总结下Redux的相关文章

ReactJS React+Redux+Router+antDesign通用高效率开发模板,夜间模式为例

工作比较忙,一直没有时间总结下最近学习的一些东西,为了方便前端开发,我使用React+Redux+Router+antDesign总结了一个通用的模板,这个技术栈在前端开发者中是非常常见的. 总的来说,我这个工程十分便捷,对于初学者来说,可能包含到以下的一些知识点: 一.React-Router的使用 Router是为了方便管理组件的路径,它使用比较简单,一般定义如下就行,需要注意的是,react-router的版本有1.0-3.0,各个版本对应的API大致相似,但也有不同,我使用的是2.X的,

关于Redux到底是个什么鬼

原文链接:https://zhuanlan.zhihu.com/p/20641377 我们故事的主人公,小明. 小明大学刚毕业,摆脱了宿舍的集体生活,自己在外面租了个一室一厅的小公寓住. 这是客厅的平面图: 一天小明邀请小马来家里做客.小马说:呀你家的家具摆放位置好奇特!这种通过眼睛看到的视觉效果,就是React.每一个家具都是一个component,各种不同的components组成了一个我们的web的'页面',或者说是所谓的'view'. 又有一天小马又来家里做客,街边买了50个肉串和10个

react+redux教程(七)自定义redux中间件

教程源代码及目录 https://github.com/lewis617/myReact 今天,我们要讲解的是自定义redux中间件这个知识点.本节内容非常抽象,特别是中间件的定义原理,那多层的函数嵌套和串联,需要极强逻辑思维能力才能完全消化吸收.不过我会多罗嗦几句,所以不用担心. 例子 例子是官方的例子real-world,做的是一个获取github用户.仓库的程序. 本例子源代码: https://github.com/lewis617/myReact/tree/master/redux-e

Redux系列x:源码解析

写在前面 redux的源码很简洁,除了applyMiddleware比较绕难以理解外,大部分还是 这里假设读者对redux有一定了解,就不科普redux的概念和API啥的啦,这部分建议直接看官方文档. 此外,源码解析的中文批注版已上传至github,可点击查看.本文相关示例代码,可点击查看. 源码解析概览 将redux下载下来,然后看下他的目录结构. npm install redux 这里我们需要关心的主要是src目录,源码解析需要关心的文件都在这里面了 index.js:redux主文件,主

正式学习React(四) ----Redux源码分析

今天看了下Redux的源码,竟然出奇的简单,好吧.简单翻译做下笔记: 喜欢的同学自己可以去github上看:点这里 createStore.js 1 import isPlainObject from 'lodash/isPlainObject' 2 import $$observable from 'symbol-observable' 3 4 /** 5 * These are private action types reserved by Redux. 6 * For any unkno

读redux有感: redux原来是这样操作的。

2017.9.10日 教师节 : ~当一个事物你没有接触,但是生活中 常常用到他,你就不得不去了解他了. 注:新手可以看一下,毕竟博主也是个菜鸟,没法写高深的东西,不想看博主扯淡的直接看第三节啦~~ 1. 生活随笔 经过半年的不懈努力(找工作),终于再任职了两个创业公司后,进入到了一个D轮中大型公司. 在上半年,第一份工作做了三个月的nodejs前端(写node的前端),回学校后就不再去了.回杭州后第二份工作比较坑,老板小人,员工一波一波的离职,我也离职了快2个月,还没给我工作,这老板人无力吐槽

React之Redux

本文简单的说下redux. 首先这有张网页,里面有文字和内容. <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv

Redux百行代码千行文档

接触Redux不过短短半年,从开始看官方文档的一头雾水,到渐渐已经理解了Redux到底是在做什么,但是绝大数场景下Redux都是配合React一同使用的,因而会引入了React-Redux库,但是正是因为React-Redux库封装了大量方法,使得我们对Redux的理解变的开始模糊.这篇文章将会在Redux源码的角度分析Redux,希望你在阅读之前有部分Redux的基础. 上图是Redux的流程图,具体的不做介绍,不了解的同学可以查阅一下Redux的官方文档.写的非常详细.下面的代码结构为Red

React 配置 Redux

Redux   Redux是 JavaScript 应用程序的可预测状态容器. 随着项目代码的不断丰富,项目中状态和业务逻辑分散在每个模块里.这让组件的重复使用变得更加困难,也让组件的数量越来越臃肿.Redux 会尝试拆分 程序数据 和 业务逻辑,将它们放在 React 自己的容器中,这样 React 就可以专注于对 视图的管理 了.这让你的软件变得更灵活. Redux的优缺点: 优缺点并不全面  优势: 1.数据流流动很自然,因为任何 dispatch 都会导致广播,需要依据对象引用是否变化来