前言
在开发前端项目时，我们常常需要对用户输入的数据进行校验。如果手写校验逻辑，代码量往往很大，还容易出错。此时，用一个成熟的校验工具可以避免我们重造轮子，提高开发效率。
npm 包 rerevalidator 就是一个适用于前端的校验库。它为我们提供了简单易用的 API，支持对对象和数组的校验，还可以针对不同的校验规则进行自定义校验。
安装
使用 npm 安装 rerevalidator：
npm install rerevalidator
基本用法
我们首先来看一下如何验证一个简单对象。假设我们有如下对象：
const user = {
username: 'foo',
password: '123456',
email: 'foo@example.com'
}我们希望验证这个对象的属性是否合法，可以使用 rerevalidator 提供的 validate 方法：
-- -------------------- ---- -------
----- ----------- - -----------------------
----- ---------- - -
----------- -
--------- - ----- --------- -------- ---------- --
--------- - ----- --------- ---------- - --
------ - ----- --------- ------- ------- -
-
--
----- ------ - -------------------------- ------------
-- -------------- -
--------------------
- ---- -
------------------- ---------------
-上面的代码中，我们首先定义了一个 userSchema，它描述了 user 对象的结构和各个属性的校验规则。然后，我们使用 revalidator 的 validate 方法进行校验。如果校验通过，result.valid 为 true，否则为 false，并且 result.errors 中包含了校验失败的具体信息。
对于数组的校验，我们可以使用 validateAll 方法：
-- -------------------- ---- ------- ----- ----- - --- -- --- ----- ---------- - - ----- -------- ------ - ----- -------- -- --------- - -- ----- ------ - ------------------------------ ------------ -- -------------- - -------------------- - ---- - ------------------- --------------- -
上面的代码中，我们定义了一个数组 items 和一个 itemSchema，然后使用 validateAll 方法进行校验。validateAll 方法的返回值和 validate 方法类似，不同之处在于它支持对数组中的每个元素进行校验。
自定义校验规则
如果 rerevalidator 提供的校验规则不能满足我们的需求，我们可以自定义校验规则。下面我们以校验手机号码格式为例来说明。
我们首先需要定义一个 validPhone 方法，它接受一个字符串参数，返回 true 表示手机号码格式正确，返回 false 表示手机号码格式不正确。例如：
function validPhone(value) {
return /^1\d{10}$/.test(value);
}然后，我们在 userSchema 中添加一个新的校验规则：
const userSchema = {
properties: {
// ...
phone: { type: 'string', validPhone: true }
},
validPhone: { message: '手机号码格式不正确', validator: validPhone }
};上面的代码中，我们通过 validPhone 属性为 phone 属性添加了一个自定义的校验规则，并且在 userSchema 中定义了 validPhone 方法，它接受一个字符串参数，返回 true 表示校验通过，返回 false 表示校验失败，并且返回一个自定义的错误信息。
我们可以用以下代码进行校验：
-- -------------------- ---- ------- ----- ---- - - -- --- ------ ------------- -- ----- ------ - -------------------------- ------------ -- -------------- - -------------------- - ---- - ------------------- --------------- -
如果我们将 phone 属性的值改为不符合手机号码格式的字符串，就会验证失败，输出错误信息。
总结
rerevalidator 是一个简单易用的校验库，支持对对象和数组进行校验，并且支持自定义校验规则。在实际开发中，我们可以基于 rerevalidator 开发出一些通用的校验组件，以提高开发效率。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/76229