轻松掌握Redux-Action使用方法


Redux-Action主要有两个方法,createAction和createAction,只要掌握了这两个方法就会了redux-action的使用。

createAction


原来创建action:

const startAction = () => ({ type: START });

使用redux-actions创建action:

import { createAction } from 'redux-actions';
const startAction = createAction(START);

handleActions


原来reducer操作state写法要使用switchif else来匹配:

function timer(state = defaultState, action) {
switch (action.type) {
case START:
return { ...state, runStatus: true };
case STOP:
return { ...state, runStatus: false };
case RESET:
return { ...state, seconds: 0 };
case RUN_TIMER:
return { ...state, seconds: state.seconds + 1 };
default:
return state;
}
}

使用redux-actions操作state:

const timer = handleActions({
START: (state, action) => ({ ...state, runStatus: true }),
STOP: (state, action) => ({ ...state, runStatus: false }),
RESET: (state, action) => ({ ...state, seconds: 0 }),
RUN_TIMER: (state, action) => ({ ...state, seconds: state.seconds + 1 }),
}, defaultState);

轻松掌握Redux-Action使用方法的更多相关文章

  1. Redux状态管理方法与实例

    状态管理是目前构建单页应用中不可或缺的一环,也是值得花时间学习的知识点.React官方推荐我们使用Redux来管理我们的React应用,同时也提供了Redux的文档来供我们学习,中文版地址为http: ...

  2. 轻松理解Redux原理及工作流程

    轻松理解Redux原理及工作流程 Redux由Dan Abramov在2015年创建的科技术语.是受2014年Facebook的Flux架构以及函数式编程语言Elm启发.很快,Redux因其简单易学体 ...

  3. react中界面跳转 A界面跳B界面,返回A界面,A界面状态保持不变 redux的state方法

    在上一篇文章中说过了react中界面A跳到B,返回A,A界面状态保持不变,上篇中使用的是传统的localStorage方法,现在来使用第二种redux的state方法来实现这个功能 现在我刚接触red ...

  4. struts2学习笔记之八:Action中方法的动态调用

    方法一:action名称+!+方法名称+后缀 Action类中增加addUser()和delUser()方法, package com.djoker.struts2; import org.apach ...

  5. [转] How to dispatch a Redux action with a timeout?

    How to dispatch a Redux action with a timeout? Q I have an action that updates notification state of ...

  6. struts2的Action该方法不能去

    最近做的一个特征,使用struts2,input标签内容,并与相应的内容背景的实体类,当提交方法,无法进入action该方法和程序没有报错被,检验N通方法还没有找到,查找终于找到了,它是input标签 ...

  7. struts 中自定义action访问方法

    struts中action类继承了ActionSupport  默认实现了execute()方法 struts.xml配置文件中 然后可以配置如下映射: <package name =" ...

  8. Struts2_day01--访问action的方法

    访问action的方法(重点) 1 有三种方式实现 第一种 使用action标签的method属性,在这个属性里面写执行的action的方法名称 第二种 使用通配符方式实现 第三种 动态访问实现(不用 ...

  9. Action的方法访问

    -------------------siwuxie095 Action 的方法访问 Action 的方法访问方式共有三种,如下: 1.通过 method 属性的配置实现 在 action 标签的 m ...

  10. redux之createStore方法底层封装模拟

    首先在看代码之前让我们一起回顾下redux的思想吧   首先redux就是一个MVC思想的框架,他总体是遵循数据的单向流动自顶向下流动 在我们仓库中有一个initState用来存储着我们的初始数据 另 ...

随机推荐

  1. java读取.txt文件工具类FileUtiles

    public class FileUtils { private static final String ENCODING = "UTF-8";//编码方式 /** * 获取文件的 ...

  2. R2CNN项目部分代码学习

    首先放出大佬的项目地址:https://github.com/yangxue0827/R2CNN_FPN_Tensorflow 那么从输入的数据开始吧,输入的数据要求为tfrecord格式的数据集,好 ...

  3. 激活函数的比较,sigmoid,tanh,relu

    1. 什么是激活函数 如下图,在神经元中,输入inputs通过加权.求和后,还被作用了一个函数.这个函数就是激活函数Activation Function 2. 为什么要用激活函数 如果不用激活函数, ...

  4. C# 中的readonly属性

    例如我们这里有一个类 class TestClass2 { private int someValue; public void ChangeValue(int newValue) { someVal ...

  5. python全栈开发day54-mysql库操作、表操作、数据类型、完整性约束

    一.昨日内容回顾 1.mysql的安装 1).解压文件 添加环境变量bin 2).初始化mysql生成数据data文件夹: mysqld --initialize-insecure 3).mysqld ...

  6. mysql中trim()函数的用法

    去除左空格函数: LTRIM(str) mysql> SELECT LTRIM(' barbar'); -> 'barbar' 去除右空格函数: RTRIM(str) mysql> ...

  7. windows server远程连接提示“终端服务器超出了最大允许连接”

  8. php json_encode转换中文乱码

    $arr = ["a"=>'范德萨似懂非懂']; echo json_encode($arr,JSON_UNESCAPED_UNICODE);

  9. NOIP2017提高组Day2T2 宝藏 洛谷P3959 状压dp

    原文链接https://www.cnblogs.com/zhouzhendong/p/9261079.html 题目传送门 - 洛谷P3959 题目传送门 - Vijos P2032 题意 给定一个 ...

  10. 069 在SparkStreaming的窗口分析

    一:说明 1.图例说明 ---------------------------------------------------------------------------------------- ...