在前端开发中，数据的校验是非常重要的一环。npm 上提供了很多优秀的校验插件，其中比较简单实用的是 very-simple-schema。本文将向您介绍如何使用这个包。
安装
在终端中，输入以下命令来安装该包：
npm install very-simple-schema
引入
在需要使用的文件中引入 very-simple-schema 包。通常情况下，我们需要在一个单独的表单组件中使用该包来进行数据校验。我们可以新建一个文件夹，将该组件放在其中，并在该组件中进行引入。
import { SimpleSchema } from 'very-simple-schema';
定义 schema
定义 schema 后，我们可以通过 check() 方法来校验表单提交的数据是否符合 schema 的定义。
下面是一个简单的 schema 定义：
-- -------------------- ---- ------- ----- ------ - --- -------------- ---------- - ----- ------- ------ ------ ------ ---- ---- -- --------- - ----- ------- ------ ----- ------ ---- ---- -- ------ - ----- ------- ------ ------ --------- ------ -------------------------------- -- ------- - ----- ------- ------ ------- ----- -------- ------ -------------------- -- ---展开代码
其中，type 表示该字段的类型，label 为该字段的名称。max 和 regEx 分别表示该字段值的最大长度和正则表达式校验。
校验数据
使用 check() 方法进行校验：
try { schema.validate(formData); // 校验成功 } catch (error) { // 校验失败 }
formData 为表单提交的数据。如果校验成功，该方法不会有任何输出。如果校验失败，它将抛出一个包含错误信息的异常。
完整示例代码
-- -------------------- ---- ------- ------ - ------------ - ---- --------------------- ------ ------- - ----- ------------- ------ - ------ - --------- - ---------- --- --------- --- ------ --- ------- --- -- -- -- -------- - ---------- - ----- ------ - --- -------------- ---------- - ----- ------- ------ ------ ------ ---- ---- -- --------- - ----- ------- ------ ----- ------ ---- ---- -- ------ - ----- ------- ------ ------ --------- ------ -------------------------------- -- ------- - ----- ------- ------ ------- ----- -------- ------ -------------------- -- --- --- - ------------------------------- -- ---- -- -------- - ----- ------- - -- ---- --------------------- - -- -- --展开代码
总结
使用 very-simple-schema 可以非常简单地实现数据校验功能。只需要定义好校验规则，然后使用 check() 方法进行校验即可。对于一些简单的校验场景，它是非常实用的一个工具。
当然，如果对于数据校验有更复杂的需求，建议使用较为完善的校验插件，例如：VeeValidate 等。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/600668f5d9381d61a3540ec3
