npm 包 @types/redux-pack 使用教程

背景介绍

Redux-Pac定义了一种将redux应用的逻辑 - 如请求和响应 以及应用状态和错误信息的表示方式。使用 @types/redux-pack 可以在 TypeScript 项目中使用 Redux-Pack。

安装方式

--- ------- ------ -----------------

示例代码

------ - ------ - ---- -------------
------ - ---------- - ---- --------------

------ ----- --------- - -- -- -
  ------ -
    ----- -----------
    -------- -----------------------
    ----- -
      ---------- ---------- -------------- -- ------------------------
      ---------- ------- ----------- -- ------------------
    -
  -
-

----- ------------- - ---------- -------------- -- -
  -- ------
-

----- ----------- - ------- ----------- -- -
  -- ------
-

----- ------- - ------ - --- ------- ---------- -- -
  ------------------- -
    ---- -----------
      ------ ------------- ------- -
        -------- ----------- ------- -- - 
          -- ------
        -
        -------- ----------- ------- -- -
          -- ------
        -
      --
    --------
      ------ ------
  -
-

API 介绍

Redux-Pack 的 action 包含三个重要的字段:type,payload 和 meta。

type

该字段是用来标识 action 类型,与普通 Redux Action 类型类似。

payload

该字段代表着 action 的载荷,用于传递数据。

meta

该字段主要用于描述额外的元数据,包括 API 请求,成功和失败处理等。在 @types/redux-pack 中,我们主要关注成功失败回调函数的设置。

@types/redux-pack 的使用

@types/redux-pack 主要导出了三个类型:

PackAction

---------- - ------ - -
  -------- ------------ - -----
  ----- -
    ----------- --------------------
    ----------- -------------------
  -
-

该类型继承了 Redux 的 Action 类型,并添加了 promise 以及 meta 成员,其中:

  • promise 是一个 Promise 对象用于处理异步操作。
  • meta 中的 onSuccessonFailure 用于处理响应(数据)和错误信息。

SuccessHandler / FailureHandler

SuccessHandler 和 FailureHandler 用于声明回调函数的类型,分别使用了 Type Parameters 用于约束函数参数。

handle

handle 函数的类型声明如下:

------------- ---------- ------- ------------------ ----- - --------- - ----- ------- ----------- --------- --------------- ------------- -----

三个参数分别为:

  • state 应用状态管理
  • action 执行的 action 对象
  • handlers 包含了针对 action 的不同处理(成功,失败)方式的函数集合

总结

@types/redux-pack 将Redux-Pac的操作与 TypeScript 结合在一起。通过引入 @types/redux-pack 包,您可以在您的 TypeScript 项目中更高效地使用 Redux-Pac,加速开发速度。

来源:JavaScript中文网 ,转载请联系管理员! 本文地址:https://www.javascriptcn.com/post/5eedc1afb5cbfe1ea0611ead


猜你喜欢

  • npm 包 @ethersproject/json-wallets 使用教程

    前言 在区块链技术的应用中,以太坊智能合约是最常见的一种。开发者可以通过以太坊智能合约来解决数字货币、资产交易等问题。而在以太坊智能合约开发过程中,安全性是至关重要的,因为智能合约一旦部署后就不能被修...

    4 年前
  • npm 包 @types/rosie 使用教程

    简介 在前端开发中,我们经常需要使用到一些数据模拟工具,以便进行测试和开发。其中,Rosie.js 是一个流行的 JavaScript 数据生成器,它提供了一种简单的方式来构建和生成复杂的数据结构。

    4 年前
  • npm 包 @ethersproject/keccak256 使用教程

    前言 在区块链开发中,安全性是最重要的一环,因此加密算法变得不可或缺。而 Keccak256 算法是现在区块链中广泛使用的哈希函数,它能够将一个长度不定的消息压缩成一个固定长度的哈希值。

    4 年前
  • npm 包 @types/roslib 使用教程

    前言 在进行前端开发时,我们常常需要使用到第三方库,这些库常常涉及到类型相关的操作。为此,npm 为我们提供了一些类型声明文件,用于在编码过程中帮助我们减少类型相关的错误。

    4 年前
  • npm 包 @ethersproject/logger 使用教程

    在以太坊开发中,日志记录是一个非常重要的环节。@ethersproject/logger 是一个强大且易于使用的 npm 包,可以帮助开发者在应用程序中添加日志功能。

    4 年前
  • npm 包 global-pack 使用教程

    使用 npm 包 global-pack 可以方便地打包和发布全局模块。这篇文章将介绍如何使用 global-pack,并提供一些示例代码和指导意义。 安装 要使用 global-pack,首先需要在...

    4 年前
  • npm 包 rot-js 使用教程

    简介 rot-js 是一个 JavaScript 库,它提供了很多实用的工具函数和类,可用于创建基于文本的游戏。这个库包含很多有趣的特性,比如地图生成、迷宫生成、随机数生成等等。

    4 年前
  • npm 包 @types/rot-js 使用教程

    在前端开发中,我们经常需要处理非常复杂的数据,并将其显示在网页上。如何处理这些数据并使它们呈现在网页上呢?这时候,使用一些强大的前端库和工具是非常重要的。本文将介绍一种强大的前端库——@types/r...

    4 年前
  • npm 包 @ethersproject/networks 使用教程

    介绍 @ethersproject/networks 是一个用于处理以太坊网络的 JavaScript 库,它提供了一系列 API 来获取网络信息、网络 ID、以太坊主链上的所有链(如 Ropsten...

    4 年前
  • npm 包 @types/routie 使用教程

    在前端开发领域中常常使用路由来控制页面的跳转和交互,同时也需要使用一些符合 TS 规范的模块来提高代码可读性和可维护性。npm 包 @types/routie 就是一个类型定义库,能够提供类型检查和提...

    4 年前
  • npm 包 @ethersproject/pbkdf2 使用教程

    介绍 在前端中,使用 PBKDF2 算法将密码加密是一种非常常见的做法。针对这种需求,@ethersproject/pbkdf2 是一个非常实用的 npm 包。本文将介绍如何用这个包来实现密码加密功能...

    4 年前
  • npm 包 @types/royalslider 使用教程

    在前端开发过程中,我们经常会使用各种库和框架来提高开发效率。其中,royalslider 是一款广受欢迎的图片轮播插件,它提供了各种丰富的功能和高度的可定制性。而如果我们想在 TypeScript 项...

    4 年前
  • npm 包 helper-read 使用教程

    简介 在前端开发中,经常需要从文本文件中读取数据,并对其进行处理。为了方便起见,我们通常使用 npm 包来完成这个任务。其中一个比较常见的 npm 包就是 helper-read。

    4 年前
  • npm 包 @ethersproject/properties 使用教程

    在前端开发中,我们有时需要在 JavaScript 对象中添加一些属性,并对其进行各种操作。但当面对复杂的对象时,这变得困难且易出错。为了解决这个问题,@ethersproject/propertie...

    4 年前
  • npm包@types/rpio使用教程

    介绍 在前端开发中,常常需要使用硬件设备进行开发,如树莓派等。而在使用树莓派过程中,我们会用到RPIO库,这个库提供了GPIO和PWM控制接口,但是其默认的类型文件并不完善,为了更好地实现类型校验和I...

    4 年前
  • npm 包 @ethersproject/providers 使用教程

    在前端开发中,当需要与以太坊网络交互时,我们需要使用一个以太坊的提供者。@ethersproject/providers 是一个流行的 npm 包,它提供了许多以太坊网络的提供者,可以方便地与以太坊网...

    4 年前
  • npm 包 @types/rrc 使用教程

    简介 @types/rrc 是针对 React 标准库中的 react-router-component (rrc) 组件的 TypeScript 类型定义文件。通过使用这个包,我们可以在使用 rrc...

    4 年前
  • npm 包 @ethersproject/random 使用教程

    介绍 在 Web3 开发中,随机数扮演着非常重要的角色。在实现建立实现加密场景,例如智能合约中的随机函数、抽奖和游戏中的随机机制时,我们需要一个强大的随机数生成器,npm 包 @ethersproje...

    4 年前
  • npm 包 @types/rsmq 使用教程

    什么是 @types/rsmq ? @types/rsmq 是一个 redis-smq 库的 TypeScript 类型定义的 npm 包。 redis-smq 是一个轻量级的 Redis 消息队列库...

    4 年前
  • npm 包 @ethersproject/rlp 使用教程

    npm 包 @ethersproject/rlp 使用教程 @ethersproject/rlp 是一个用于实现递归长度前缀(RLP)编解码的 npm 包。递归长度前缀是以太坊区块链中经常使用的编码方...

    4 年前

相关推荐

    暂无文章