简介
在前端开发过程中，我们经常需要处理数字或者金额等类型的输入，而针对于这类输入，我们可能需要进行多重校验，比如保留小数位数、判断是否为正数等。为了便于开发，npm社区陆续涌现了许多优秀的库，在处理这种场景时可以大大提高我们的效率和质量。@braden-m/graphql-input-number就是其中之一，它提供了便捷的数字类型输入校验和处理。接下来，本篇文章将介绍如何安装、配置和使用该npm包。
安装
在使用@braden-m/graphql-input-number之前，需要确保在本地的环境中已经完成npm的安装和配置。然后可以通过以下命令安装该包：
npm install @braden-m/graphql-input-number
如果你使用的是yarn，可以使用以下命令：
yarn add @braden-m/graphql-input-number
配置
安装成功后，还需要添加如下配置：
Step 1
首先，需要在项目中引入该包：
import { inputNumberType } from '@braden-m/graphql-input-number';Step 2
然后，在graphql的schema中定义数字类型：
-- -------------------- ---- -------
----- -------- - ----
------ -------
----- ------ -
---
------ -------
---
-
---
--Step 3
在解析上传数据时，需要对价格字段进行校验。这里使用formatNumber方法可以更好方便的处理。针对不同的类型，实例化不同的对象。代码如下所示：
-- -------------------- ---- -------
------ - ------------- - ---- ---------------------------------
---
------ ----- --------- - -
--------- -
----------- --- - ---- -- -- -
---
----- ------------- - --- ----------------
----------------- - ----------------------------------------------
---
-
-
--
---使用
以上就是配置该包的所有步骤。此时，就可以使用该包提供的方法进行数据的校验了。示例如下：
import { DecimalNumber } from '@braden-m/graphql-input-number';
...
const decimalNumber = new DecimalNumber();
const amount = '-23.4555555';
const result = decimalNumber.formatNumber(amount);
console.log(result); // -23.46
...上述代码使用@braden-m/graphql-input-number包中的DecimalNumber方法，对-23.4555555进行校验，并返回-23.46。
总结
通过@braden-m/graphql-input-number包提供的函数，可以轻松地进行数字类型的输入校验。在实际开发过程中，我们可以根据自己的需求，对该包进行二次封装，以便更好地适应项目的需求。同时，学习和使用npm包也是一件相当有必要的事情，希望本篇文章能够对读者有所指导和帮助。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/60066b5451ab1864dac6697a