npm 包 erschema-selectors 使用教程

erschema-selectors 是一个基于 reselect 的 npm 包,旨在帮助开发者更加便捷、精确、高效地使用 erschema 中的数据。本文将介绍 erschema-selectors 的使用教程,包括安装、使用方法、示例代码等。

1. 安装

你可以通过以下命令来安装 erschema-selectors:

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

2. 使用方法

在使用 erschema-selectors 之前,你需要先了解以下概念。

2.1 erschema

erschema 是一个能够帮助开发者定义和验证 API 响应的库。它基于 Joi,主要是为了能够在前端上利用 Joi 创建 schema,并对 API 响应数据进行验证。

2.2 reselect

reselect 是一个创建可记忆的、可组合的、高效的 selector 函数的库。在重新计算结果的过程中,所有的中间结果都缓存起来,只在必要时重新计算结果。

2.3 erschema-selectors

erschema-selectors 利用了 reselect 的功能,帮助开发者更加便捷、精确、高效地使用 erschema 中的数据。

2.3.1 基本用法

首先,你需要创建一个 erschema 实例,并定义一个 schema。

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

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

之后,你需要创建一个 selector 函数,帮助你获取特定字段的数据。

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

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

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

这个 selector 函数接受一个参数为 state,返回 state 中的 data 字段。之后,再返回 data 的 id 字段。你可以通过这个 selector 函数获取一个精确的数据。

2.3.2 高级用法

erschema-selectors 还提供了一些高级的特性,能够帮助你更加准确地处理数据。

比如,你可以使用 hasError 属性来判断数据是否符合 schema。

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

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

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

这个 selector 函数接受一个参数为 state,返回 state 中的 data 字段。之后,再使用 hasError 函数判断 data 是否符合 schema。如果符合 schema,返回 false。否则,返回 true。

另外,你还可以使用 selectSchema 属性来获取一个结构化的 schema。

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

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

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

这个 selector 函数接受一个参数为 state,并返回 state 中的 data 字段。之后,再使用 selectSchema 函数,按照格式化的形式返回 schema。

3. 示例代码

下面是一个使用 erschema-selectors 的完整示例代码。

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

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

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

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

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

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

4. 总结

综上所述,erschema-selectors 是一个非常有用的 npm 包,能够帮助前端开发者更加方便、精确、高效地使用 erschema 中的数据。通过本文的介绍,相信你已经掌握了使用 erschema-selectors 的方法,随时可以在自己的项目中使用了。

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


猜你喜欢

  • npm包react-js-diagram使用教程

    在前端开发中,图表和流程图是非常重要的组件。npm包react-js-diagram是一个基于React的JavaScript库,它提供了一个简单易用的方式用于创建可定制性较高的流程图和设计器。

    3 年前
  • npm包veams-redux-blueprint使用教程

    介绍 veams-redux-blueprint是一个用于快速生成基于React和Redux的应用程序模板的脚手架工具。它提供了一套可用的目录结构和配置,减少了应用程序初始化的时间,使开发人员可以更快...

    3 年前
  • npm 包 charto-3d 使用教程

    前言 在现代 web 开发中,数据的展现是非常重要的一部分。而图表作为一种常见的数据展现方式,是每一个前端工程师都需要掌握的技能之一。在本篇文章中,我们将介绍 npm 包 charto-3d,它拥有强...

    3 年前
  • npm 包 dbio-mysql 使用教程

    引言 在前端开发过程中,使用数据库是非常常见的需求,而 mysql 数据库的使用更是最为广泛的一种数据库,市面上也有很多的 mysql 数据库客户端,其中 dbio-mysql 是一款基于 promi...

    3 年前
  • npm 包 eslint-config-plat 使用教程

    什么是 eslint-config-plat? eslint-config-plat 是一个基于 ESLint 的 JavaScript 代码风格检查工具,它是以 Airbnb 的 JavaScrip...

    3 年前
  • npm 包 regular-color 使用教程

    前言 正则表达式是前端开发中常用的一种工具,用于匹配需要的文本信息。而不同的文本信息往往需要不同的颜色进行标识,这就需要使用到颜色选择器来获取相应的颜色值。为了方便开发人员进行前端开发,已经有了一些比...

    3 年前
  • npm 包 tscli 使用教程

    随着前端技术的不断发展,TypeScript 逐渐成为了前端领域的重要语言之一。为了更好地解决 TypeScript 的开发问题,开发者推出了许多优秀的开源工具,其中就包括了 npm 包 tscli。

    3 年前
  • npm 包 polite-asset-loader 使用教程

    近年来,前端开发中的图片、视频等资源文件越来越大,加载速度也成了重要的性能优化点之一。polite-asset-loader 是一款基于 webpack 的前端资源懒加载工具,可以帮助我们优化资源加载...

    3 年前
  • npm 包 ember-simple-auth-u2f 使用教程

    在现今的互联网环境中,安全性的保障是至关重要的,而两步验证(2FA)是一种普遍的加强安全性的方法。其中 U2F 是 2FA 的一种常用方式。ember-simple-auth-u2f 是一个基于 Em...

    3 年前
  • npm 包 @dataplug/hubspot-dataplug 使用教程

    简介 @dataplug/hubspot-dataplug 是一个针对 Hubspot 开发者的 npm 包,它提供了一些便捷的方法来与 Hubspot 中的数据进行交互。

    3 年前
  • npm 包 node_study_denghao 使用教程

    引言 在前端开发中,我们常常需要引用第三方库或工具来对代码进行优化和扩展。npm 包是一个非常重要的资源库,其中涵盖了大量的前端工具和框架。在这篇文章中,我们将介绍一个名为 node_study_de...

    3 年前
  • npm包akshay.r使用教程

    介绍 npm是一个 JavaScript 包管理器,可以方便地在项目中引入和管理第三方的 JavaScript 包。 akshay.r是一个用于计算某个日期到相对于该日期的未来或过去某个日期的 Jav...

    3 年前
  • npm 包 prajna-preset 使用教程

    在前端开发中,经常会用到各种 npm 包来加速开发效率。其中一个非常实用的 npm 包就是 prajna-preset,它可以为前端项目提供快速开发所需的各种依赖。

    3 年前
  • npm 包 reslider 使用教程

    什么是 reslider reslider 是一款轻量级的、基于 jQuery 的图片轮播插件。它提供了简单易用的 API 和丰富的配置选项,可以帮助开发者快速构建各种类型的幻灯片展示。

    3 年前
  • npm 包 @robinsouthgate/rpi-rgb 使用教程

    在前端开发中,常常需要和硬件进行交互。Raspberry Pi,是一款便携式单板计算机,被广泛应用于物联网、机器人控制等领域。而 @robinsouthgate/rpi-rgb 这个 npm 包,可以...

    3 年前
  • npm 包 azn_rates 使用教程

    本文将为大家介绍一款前端开发中经常会用到的 npm 包,即 azn_rates。azn_rates 是一个用于获取阿塞拜疆曲曲的最新汇率的 npm 包,使用简单,功能强大,非常适合于前端开发者在开发过...

    3 年前
  • npm 包 cards-52-encoder 使用教程

    npm 包 cards-52-encoder 使用教程 在前端开发中,经常会用到卡牌游戏相关的功能,而将卡片转换成常见的数字和字母数值是其常见需求之一。此时,就可以使用 npm 包 cards-52-...

    3 年前
  • npm 包 groupcenter-datos-basicos-persona-frontend 使用教程

    什么是 groupcenter-datos-basicos-persona-frontend? groupcenter-datos-basicos-persona-frontend 是一个基于 Vue...

    3 年前
  • npm 包 amsued_ceshibao 使用教程

    什么是 amsued_ceshibao? amsued_ceshibao是一个前端H5开发过程中的常用工具库,提供了多种常用函数和方法,可以让开发者更加高效地进行开发。

    3 年前
  • npm 包 mixpanel-tail 使用教程

    前言 mixpanel-tail 是一款帮助前端开发者进行 Mixpanel 数据统计的 npm 包。在互联网时代,数据统计是非常重要的,它可以帮助我们更好地了解用户、优化产品、提升用户满意度。

    3 年前

相关推荐

    暂无文章