Redux学习笔记-基础知识

时间:2023-02-19 08:51:08

 

Redux概述

是什么:Redux是管理状态的容器,提供可预测的状态管理。

怎么做:Redux主要是用来管理组件或者应用的状态,本质上跟一个事件处理器差不多。通过分发action触发reduce来处理state。 特点:

  1. 单一数据源。

    整个应用的state是唯一,state的更新引发应用或者组件的更新,在整个程序运行期间,state有且仅有一个。

  1. State只读

    唯一改变state的方法是触发action,在reduce中 重置 state的属性, 3. 纯函数执行修改

    相同的输入对应相同的输出

基础信息

action

action是把数据从应用传到store的有限载荷。其本质上的一个js对象。按照约定,action对象中应该有一个type 字段来表示将要执行的动作,其他属性可以*定义。 在整个数据流中,action扮演的是一个消息通知者的角色,简单的说就是告知store哪些‘事件’被触发了。redux可以通过reduce根据不同的action来对state做不同的操作。

Reducer

如果说action是‘事件’的话,那么reducer就是‘事件处理器’。 在Redux应用中,所有的state都保存在唯一的对象中。

reducer 就是一个纯函数,接收旧的 state 和 action,返回新的 state。现在只需要谨记 reducer 一定要保持纯净。只要传入参数相同,返回计算得到的下一个 state 就一定相同。没有特殊情况、没有副作用,没有 API 请求、没有变量修改,单纯执行计算。

永远不要在 reducer 里做这些操作:

修改传入参数;

执行有副作用的操作,如 API 请求和路由跳转;

调用非纯函数,如 Date.now() 或 Math.random()。

注意

1.不要修改state。使用新的对象,然后将原有state值拷贝到新对象而不是直接在老对象上更新属性,js对象都是引用,如果在原有state上更新,可能会导致Redux无法正确完成state的diff比较。

2. 默认情况下返回原有state

其他:

使用combineReducers() 来组合reducer。

store

如果说action是‘事件’,reducer是‘事件处理器’,那么store就是全局的事件管理对象。 每个Redux应用都应该只有 一个单一的store。但需要拆分数据处理逻辑时,应该使用Reducer组合而不是创建多个store。

Store主要有以下职责:

  • 维持应用的 state;
  • 提供 getState() 方法获取 state;
  • 提供 dispatch(action) 方法更新 state;
  • 通过 subscribe(listener) 注册监听器;
  • 通过 subscribe(listener) 返回的函数注销监听器。

通过createStore()方法创建store实例,该方法接受两个参数:第一个是reducer,就是action的处理函数,第二个是可选参数,用来设置state的初始状态。

数据流

所有Redux应用中,数据的流向是单向的,具体可以从以下几点来理解:

  1. 分发action
    通过调用store.dispatch(action)来分发action。我们可以在任何地方调用此方法来分发action。
  2. 处理action
    通过store分发的action,被创建store实例时使用的reducer处理。
  3. 合并state

多个Reducer共同处理action后,把state合并成一个新的state对象。 4. 返回新state

最终返回一个新的state对象,Redux应用可以使用该state做其他事情了。

[参考redux官方文档](http://www.redux.org.cn/)

Redux学习笔记-基础知识的更多相关文章

  1. jQuery学习笔记 - 基础知识扫盲入门篇

    jQuery学习笔记 - 基础知识扫盲入门篇 2013-06-16 18:42 by 全新时代, 11 阅读, 0 评论, 收藏, 编辑 1.为什么要使用jQuery? 提供了强大的功能函数解决浏览器 ...

  2. three.js学习笔记--基础知识

    基础知识 从去年开始就在计划中的three.js终于开始了 历史介绍 (摘自ijunfan1994的转载,感谢作者) OpenGL大概许多人都有所耳闻,它是最常用的跨平台图形库. WebGL是基于Op ...

  3. SQLServer学习笔记<>.基础知识,一些基本命令,单表查询(null top用法,with ties附加属性,over开窗函数),排名函数

    Sqlserver基础知识 (1)创建数据库 创建数据库有两种方式,手动创建和编写sql脚本创建,在这里我采用脚本的方式创建一个名称为TSQLFundamentals2008的数据库.脚本如下:   ...

  4. Java Script 学习笔记 -- 基础知识

    Java script 概述 java Script 的简介 JavaScript一种直译式脚本语言,是一种动态类型.弱类型.基于原型的语言,内置支持类型.它的解释器被称为JavaScript引擎,为 ...

  5. java虚拟机JVM学习笔记-基础知识

    最近使用开发的过程中出现了一个小问题,顺便记录一下原因和方法--java虚拟机 媒介:JVM是每一位从事Java开发工程师必须翻越的一座大山! JVM(Java Virtual Machine)JRE ...

  6. hadoop学习笔记——基础知识及安装

    1.核心 HDFS  分布式文件系统    主从结构,一个namenoe和多个datanode, 分别对应独立的物理机器 1) NameNode是主服务器,管理文件系统的命名空间和客户端对文件的访问操 ...

  7. php学习笔记——基础知识(2)

    9.PHP语句 if 语句 - 如果指定条件为真,则执行代码 if...else 语句 - 如果条件为 true,则执行代码:如果条件为 false,则执行另一端代码 if...else if.... ...

  8. php学习笔记——基础知识(1)

    1.PHP 脚本在服务器上执行,然后向浏览器发送回纯 HTML 结果. 2.基础 PHP 语法 1)PHP 脚本可放置于文档中的任何位置. 2)PHP 脚本以 <?php 开头,以 ?> ...

  9. GO Lang学习笔记 - 基础知识

    Go lang Learn Note 标签(空格分隔): Go Go安装和Go目录 设置环境变量GOROOT和GOPATH,前者是go的安装目录,后者是开发工作目录.go get包只会将包下载到第一个 ...

随机推荐

  1. vs中&OpenCurlyDoubleQuote;Stack around the variable was corrupted”的解决方案

    把 project->配置属性->c/c++->代码生成->基本运行时检查 为 默认值 就不会报本异常.具体原因正在研究中... 如果改为其他就有exception. exce ...

  2. iOS之两个ImageView实现图片滚动

    原创作者:codingZero 导语 在不少项目中,都会有图片轮播这个功能,现在网上关于图片轮播的框架层出不穷,千奇百怪,笔者根据自己的思路,用两个imageView也实现了图片轮播,这里说说笔者的主 ...

  3. hdoj 5399 Tpp simple

    WA了一下午.... 1WA:T了,因为阶乘没打表所以时间超了.. 2WA,3WA:runtime error,检查的value数组开小了,应该是MAXN.. 4WA.5WA.6WA:改了改对cnt的 ...

  4. 网络协议- HTTP

    http:是用于www浏览的一个协议.tcp:是机器之间建立连接用的到的一个协议.

  5. AFNetworiking与ASIHttpRequest对比

    在开发iOS应用过程中,如何高效的与服务端API进行数据交换,是一个常见问题.一般开发者都会选择一个第三方的网络组件作为服务,以提高开发效率和稳定性.这些组件把复杂的网络底层操作封装成友好的类和方法, ...

  6. 回归 WordPress

    一直很喜欢用WordPress,使用方便,模板容易定制,国内建站可选择的虚拟主机多.自从WordPress升级后,官方网站打不开,从 GitHub 安装 WordPress 后无法浏览在线的主题.一切 ...

  7. MySQL集群(四)之keepalived实现mysql双主高可用

    前面大家介绍了主从.主主复制以及他们的中间件mysql-proxy的使用,这一篇给大家介绍的是keepalived的搭建与使用! 一.keepalived简介 1.1.keepalived介绍 Kee ...

  8. CRM系统&lpar;第一部分&rpar;

      阅读目录 1.需求分析 2.数据库表设计 3.起步 4.录入数据 5.知识点 1.需求分析 CRM客户关系管理软件---> 学员管理 用户:企业内部用户 用户量: 业务场景: 2.数据库表设 ...

  9. Hackintosh Power Management

    Also, be aware that hibernation (suspend to disk or S4 sleep) is not supported on hackintosh. You sh ...

  10. js delete删除对象属性,delete删除不了变量及原型链中的变量

    js delete删除对象属性,delete删除不了变量及原型链中的变量 一.delete删除对象属性 function fun(){ this.name = 'gg'; } var obj = ne ...