React@16.x(53)Redux@4.x(2)- action

目录

  • 1,特点
    • 1.1,payload
    • 1.2,type
    • 1.3,bindActionCreators

1,特点

是一个平面对象(plain-object)。换句话说,就是通过字面量创建的对象,它的 __proto__ 指向 Object.prototype

该对象有2个属性:

const action = {type: 'add',payload: 3
}

1.1,payload

表示额外需要传递的附加数据。

只是约定俗成用该属性,不做强制要求。

1.2,type

1,必须type 属性,用于描述操作的类型,但没有对 type 值的类型做限制。

2,在大型项目中,由于操作类型比较多,为了避免硬编码,会将 actiontype 放到一个单独的文件中。

3,为了方便传递 action,通常会使用一个纯函数来创建它。该函数被称为 action creator

纯函数:

  • 不能改变参数。
  • 没有异步。
  • 不对外部环境中的数据有影响。

举例:

// actionTypes.js
export const ADD = Symbol("add");
export const SET = Symbol("set");
// action.js
import { ADD, SET } from "./actionTypes";export function getAddAction() {return {type: ADD,};
}export function getSetAction(newValue) {return {type: SET,payload: newValue,};
}
import { createStore } from "redux";
import { ADD, SET } from "./actionTypes";
import * as numberAction from "./action";function reducer(state, action) {if (action.type === ADD) {return state + 1;} else if (action.type === SET) {return action.payload;}return state;
}const store = createStore(reducer, 10);
store.dispatch(numberAction.getAddAction());
console.log(store.getState()); // 11
store.dispatch(numberAction.getSetAction(3));
console.log(store.getState()); // 3

1.3,bindActionCreators

为了更方便的利用 action creator 来分发 actionredux 提供了 bindActionCreators

它可以创建 action 后自动完成分发。

  • 第1个参数,action creator 的集合。
  • 返回值,一个新的对象,和第1个参数的属性名一致。
import { createStore, bindActionCreators } from "redux";
import * as numberAction from "./action";// ...const store = createStore(reducer, 10);
const bindActions = bindActionCreators(numberAction, store.dispatch);// store.dispatch(numberAction.getAddAction());
bindActions.getAddAction();
// store.dispatch(numberAction.getSetAction(3));
bindActions.getSetAction(3);

下篇文章 Redux-reducer介绍

以上。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/pingmian/44861.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

window11连接lenovo 熊猫 Pro 打印机 M7328W

1、win11先下驱动(将USB线接至电脑、电源通电),型号在后背面插电源的地方可以找到。 图1 开始电源按钮,会有蓝、绿、红闪烁灯光循环显示。 下载驱动: 图像发现 M7328W 然后按照说明书安装即可。 2、安装完成后&…

Delta的最新更新可让iPad用户同时模拟多款游戏

Delta iOS 应用程序发布了一个更新,引入了复古 游戏模拟器重新设计的标识,以及原生 iPad 支持,允许用户同时玩多个 游戏。 据 Delta 开发者 Riley Testut 称,欧盟用户可以立即通过AltStore PAL 下载更新,但其他用户则需…

YOLO v8进行目标检测的遇到的bug小结

OSError: [WinError 1455] 页面文件太小,无法完成操作。 我的python环境是放在C盘的: 在“我的电脑”点击鼠标右键,打开“属性”点击高级系统设置点击“设置”找到“高级”点击“更改”分配“虚拟内存”(这里需要重启电脑才能生…

【机器学习】朴素贝叶斯算法详解与实战扩展

欢迎来到 破晓的历程的 博客 ⛺️不负时光,不负己✈️ 引言 朴素贝叶斯算法是一种基于概率统计的分类方法,它利用贝叶斯定理和特征条件独立假设来预测样本的类别。尽管其假设特征之间相互独立在现实中往往不成立,但朴素贝叶斯分类器因其计算…

dataset source

ObjectMapper objectMapper new ObjectMapper();JsonNode chartValueJson objectMapper.readTree(chartValue);// 获取dataset节点ArrayNode dataset (ArrayNode) chartValueJson.path("dataset");// 找到source节点并替换它for (JsonNode node : dataset) {if (n…

项目纪实 | 业务不停机、升级0感知!万里数据库生产环境助力操作系统升级 获客户点赞

为积极响应和落实国家、集团相关要求,某运营商省公司历时一个月将GreatDB数据库集群下Red Hat操作系统升级为BigCloud操作系统,以建立完善的IT自主可控体系,推动产业链生态发展。 源起:项目背景一览 2024年初,万里数…

基础架构服务API:降低成本,提升业务效益

基础架构服务API的应用可以显著降低企业的成本,并提升业务效益。通过使用这些API,企业可以充分利用云计算、自动化部署和资源管理等功能,从而减少了传统基础设施所需的大量投资和维护成本。这些API还提供了弹性扩展和自动化功能,使…

flutter常用库的介绍(1)

import dart:async; 是在Dart语言中用来引入Dart标准库中的 async 和 await 等异步编程相关的功能的声明。具体作用如下: 引入异步编程的功能: Dart中的 async 和 await 关键字用于编写异步代码,即可以处理非阻塞的操作,如等待I/O操作、定时器…

ABeam News | FY25 ABeam德硕大中华区入社式,飞往崭新航向!

FY25 ABeam大中华区入社式 7月1日,51名 ABeam大中华区新生在艾宾信息技术开发(上海)有限公司大连分公司(以下简称TDC)报到,我们为他们的到来准备了隆重的入社仪式,并举办了热情而又温馨的欢迎晚…

【OC】OC与MHA对比

MHA 简介 MHA(Master High Availability)目前在MySQL高可用方面是一个相对成熟的解决方案,它由日本DeNA公司youshimaton(现就职于Facebook公司)开发,是一套优秀的作为MySQL高可用性环境下故障切换和主从提…

springboot美食分享平台-计算机毕业设计源码45429

基于Web美食分享平台的系统设计与实现 摘 要 本研究基于Spring Boot框架,设计并实现了一个Web美食分享平台,旨在为用户提供一个交流分享美食体验的社区平台。该平台涵盖了用户注册登录、美食制作方法分享发布、点赞评论互动等功能模块,致力于…

cdr捕捉点怎么设置---模大狮模型网

在 CorelDRAW 中,捕捉点(Snap Points)是一种非常有用的功能,它可以帮助你在绘制和编辑图形时对齐、定位和调整对象。以下是关于如何设置捕捉点的简要步骤: 打开和设置捕捉点: 打开捕捉点控制器: 在 CorelDRAW 的顶部菜…

C# 解析省份、城市、区域 json文件

一、json文件内容如下,(小程序里好像有用到...): 二、读取包含省份城市区域的json文件,并整理成想要的结果: string path Server.MapPath("/js"); string file System.IO.Path.Combine(path, "数据.…

JVM:SpringBoot TomcatEmbeddedWebappClassLoader

文章目录 一、介绍二、SpringBoot中TomcatEmbeddedWebappClassLoader与LaunchedURLClassLoader的关系 一、介绍 TomcatEmbeddedWebappClassLoader 是 Spring Boot 在其内嵌 Tomcat 容器中使用的一个类加载器(ClassLoader)。在 Spring Boot 应用中&#…

Python图形用户界面的文本文件加密工具

Python图形用户界面的文本文件加密工具 [外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-x5oEvdLE-1720676762602)(https://i-blog.csdnimg.cn/direct/ddf0cd975b2d48a9a2f3b35c55e00add.png)] 设计方案 DES.py DESAlgorithm 类负责管理密钥并提供…

电焰灶:烹饪性能的深度剖析

在如今众多的厨房炉灶选择中,华火电焰灶以其独特的技术和性能吸引了不少消费者的目光。那么,华火电焰灶的综合烹饪性能究竟如何呢?让我们一起来深入探究。 首先,从火力方面来看,华火电焰灶展现出了强大的优势。其火焰强…

systemctl命令,启动服务,停止服务,查看服务状态,设置开机自启。

systemctl 是用于与 systemd 初始化系统和服务管理器进行交互的命令行工具。systemd 是许多 Linux 发行版默认的系统和服务管理器&#xff0c;它负责启动和管理系统服务。 以下是一些常用的 systemctl 命令&#xff1a; 启动服务: sudo systemctl start <service_name> …

VS2019使用C#写窗体程序技巧(1)

1、打开串口 private void button1_Click(object sender, EventArgs e){myPort cmb1.Text;mybaud Convert.ToInt32(cmb2.Text, 10);databit 8;parity Parity.None;stopBit StopBits.One;textBox9.Text "2";try{sp new SerialPort(myPort, mybaud, parity, dat…

LLMs的基本组成:向量、Tokens和嵌入

编者按&#xff1a;随着人工智能技术的不断发展&#xff0c;大模型&#xff08;语言、视觉&#xff0c;或多模态模型&#xff09;已成为当今AI应用的核心组成部分。这些模型具有处理和理解自然语言等模态输入的能力&#xff0c;推动了诸如聊天机器人、智能助手、自动文本生成等…

私域社群的组织及运营角色定位、分工

私域社群运营是一个涉及多个角色和职能的复杂过程&#xff0c;每个角色都有其特定的职责和目标。以下是一些常见角色及其职能内容的概述&#xff1a; 产品经理&#xff08;Product Manager&#xff09; 负责私域社群产品的规划、设计和迭代。理解用户需求&#xff0c;收集用户反…