踩坑一,reducer过于抽象

reducer写得没那么抽象也不会有人怪你的。_

reducer其实只有一个,由不同的reducer composition出来的。所以,

  1. reducer的父作用域是共享的
  2. 某一个action被发出后,会在reducer中进行查找出来的reducer代码

例如:

//reducer01.js
const disposeFetchRandom = (preState = {}, action) => {
switch (action.type) {
case `${REQUEST_BEGIN}${action.condition}`:
case `${RECEIVED}${action.condition}`:
case `${RECEIVE_FAILED}${action.condition}`:
//do something to state
default:
return preState;
}
}

//reducer02.js
const disposeCategories = (preState = {}, action) => {
let condition = action.condition
switch (action.type) {
case `${REQUEST_BEGIN}${condition}`:
case `${RECEIVED}${condition}`:
case `${RECEIVE_FAILED}${condition}`:
//do something
default:
return preState
}
}

针对上面两个Reducer:

  1. dispatch({type: "REQUEST_BEGIN_RANDOM"})时,reducer01.jsreducer02.js都会对其进行处理
  2. 无法处理dispatch({type: "REQUEST_BEGIN_RANDOM})dispatch({type: "REQUEST_BEGIN_CATEGORIES"})这两个action
  3. 解决办法。改为(以reducer01.js为例)
//reducer01.js
const RANDOM = "_RANDOM";
const disposeFetchRandom = (preState = {}, action) => {
switch (action.type) {
case REQUEST_BEGIN + RANDOM://必须明确指定action.type
case RECEIVED + RANDOM:
case RECEIVE_FAILED + RANDOM:
//do something to state
default:
return preState;
}
}

redux reducer笔记的更多相关文章

  1. React+Redux学习笔记:React+Redux简易开发步骤

    前言 React+Redux 分为两部分: UI组件:即React组件,也叫用户自定义UI组件,用于渲染DOM 容器组件:即Redux逻辑,处理数据和业务逻辑,支持所有Redux API,参考之前的文 ...

  2. 【原】redux学习笔记

    上周学习了flux,这周研究了一下redux,其实很早之前都已经在研究他们了,只是之前一直没搞懂,最近这两周可能打通了任督二脉,都算入门了. 写博客的目的主要是做一下笔记,总结一下思路,以及和大家交流 ...

  3. redux学习笔记

    中文api:http://cn.redux.js.org/docs/react-redux/troubleshooting.html 3.6 Reducer Store 收到 Action 以后,必须 ...

  4. [Redux] Reducer Composition with Arrays

    In the previous lesson we created a reducer that can handle two actions, adding a new to-do, and tog ...

  5. Redux学习笔记:Redux简易开发步骤

    该文章不介绍Redux基础,也不解释各种乱乱的概念,网上一搜一大堆.只讲使用Redux开发一个功能的步骤,希望可以类我的小白们,拜托它众多概念的毒害,大牛请绕道! 本文实例源代码参考:React-Re ...

  6. Redux 学习笔记

    1:首先安装redux: npm install --save redux 2:引入redux : import { createStore } from 'redux'; //首先创建执行函数,Re ...

  7. Redux学习笔记--异步Action和Middleware

    异步Action 之前介绍的都是同步操作,Redux通过分发action处理state,所有的数据流都是同步的,如果需要一步的话怎么办? 最简单的方式就是使用同步的方式来异步,将原来同步时一个acti ...

  8. Redux学习笔记-基础知识

      Redux概述 是什么:Redux是管理状态的容器,提供可预测的状态管理. 怎么做:Redux主要是用来管理组件或者应用的状态,本质上跟一个事件处理器差不多.通过分发action触发reduce来 ...

  9. Redux学习笔记-----基础部分

    Redux的基本原则 唯一数据源(应用的状态数据应该只存储在唯一的一个store上): 保持状态只读(不能直接修改Store的状态,而是应该通过派发一个action对象来完成) 数据改变只能通过纯函数 ...

随机推荐

  1. 使用analyze命令统计信息

    ① 搜集和删除索引.表和簇的统计信息② 验证表.索引和簇的结构③ 鉴定表和簇和行迁移和行链接针对analyze的搜集和删除统计信息功能而言Oracle推荐使用DBMS_STATS包来代替analyze ...

  2. Solidity开发注意

    pragma版本:1.版本要高于0.4.24才可以编译:2.高于0.5的版本则不可编译:3.第三位的版本号可以变,留出来用做bug可以修复(如0.4.1的编译器有bug,可在0.4.2修复,现有合约不 ...

  3. 从 SVN 迁移至 Git 并保留所有 commit 记录

    yum install -y git-svn 用户映射文件user.txt,等号左边为svn账号,右边为Git用户名和邮箱.注意:svn中有多少用户就要映射多少 test1=test1<1472 ...

  4. 什么是依赖注入 IoC

    设计原则:依赖注入原则 依赖倒置原则,是一种程序设计模式的原则 高层模块不应该依赖底层模块,二者都应该依赖其抽象. 抽象不应该依赖细节,细节应该依赖抽象.依赖导致原则很好的体现了“面向接口编程”的思想 ...

  5. python网络编程 - tcp

    网络编程 低级别的网络服务 高级别的网络服务 socket又称“套接字”,应用程序通过“套接字”向网络发出请求或者应答网络请求,使主机间或者一台计算机上的进程间可以通讯. tcp 传输控制协议(Tra ...

  6. LwIP应用开发笔记之七:LwIP无操作系统HTTP服务器

    前面我们实现了TCP服务器和客户端的简单应用,接下来我们实现一个基于TCP协议的应用协议,那就是HTTP超文本传输协议 1.  HTTP协议简介   超文本传输协议(Hyper Text Transf ...

  7. 对Dev的GridControl/GridView控件进行分组并展开操作

    今天在模块编写中碰到了对表格的分组,特意在这里把它记录下来. 一.背景:Dev14.1.3,GridControl,.NET4.0+C# 二.过程 1.GridControl设计 一共添加4列:在下面 ...

  8. Zabbix 3.0 配置企业微信报警(配置zabbix-web)

    一.添加报警媒体类型 Name:自定义 Type:选择script Scripts name:填写脚本名称 Script parameters:脚本参数 --corpid=XXX --corpsecr ...

  9. ASP.NET Core 之跨平台的实时性能监控

    前言 前面我们聊了一下一个应用程序 应该监控的8个关键位置. . 嗯..地址如下: 应用程序的8个关键性能指标以及测量方法 最后卖了个小关子,是关于如何监控ASP.NET Core的. 今天我们就来讲 ...

  10. Java课堂笔记1

    1.  Java严格区分大小写 2.  一个源文件public主类名必须和文件名完全一致 3. 命名规则严格要求,字母.数字.下划线.美元符号$.下划线_组成,其中不能以数字开头,也不能使用Java的 ...