在前端开发中,数据校验是一个非常重要的环节。为了避免在表单提交、接口调用等过程中出现数据异常,我们需要对数据进行校验。而 npm 上有许多数据校验的包,本文将介绍一款名为 ensure-validation 的 npm 包的使用教程。
ensure-validation 简介
ensure-validation 是一款轻量级的数据校验工具库,它支持链式编程和异步校验,具有以下特点:
- 灵活的链式编程方式:可以根据需求随意链式调用各项校验规则。
- 异步校验:可以通过异步请求、异步验证等方式进行校验,不受网络请求影响。
- 多种校验方式:支持正则表达式、自定义规则、简单的方法校验等多种校验方式。
安装及使用方式
安装方式可以使用 npm 包管理器:
npm install ensure-validation
使用方式:
const ensure = require('ensure-validation');
基本用法
// 最简单的使用方式 ensure('hello world').isString(); // true
如上所示,ensure-validation 对于基本类型的数据类型校验非常简单。它可以根据数据类型自动识别校验规则。
复杂用法
// 支持链式调用,效果等同于 ensure('hello world').isString().minLength(5) ensure('hello world').isString().minLength(5); // 支持正则表达式方式校验 ensure('hello world').match(/hello/); // true // 支持自定义校验规则 ensure('hello world').test(value => value === 'hello world'); // true
异步校验
// 异步校验 ensure.promise('hello world', value => { return new Promise((resolve, reject) => { setTimeout(() => { resolve(value === 'hello world'); }, 500); }); }).then(result => console.log(result)); // true
如上所示,通过将函数作为参数并返回 promise,ensure-validation 支持异步校验。当校验成功后才会触发 promise 的 resolve。
应用示例
以一个登陆表单的校验为例,示例校验账号和密码分别为必填项,且账号长度应大于等于 6,密码长度应大于等于 8。
-- -------------------- ---- ------- ----- ------ - ----------------------------- ----- ---- - - --------- --- --------- --- -- ----- ----- - - --------- -------------------------------------------- --------- -------------------------------------------- -- -- ------ -------- -------------- ------ - --- ------ --- -- ----- - -- -------------------------- - ----- ------ - --------------------------- -- --------- - ------ ------ - - - ------ ----- - -------------------------- -------- -- -----
如上所示,我们可以将校验规则先定义好,然后通过一个校验函数 validate 进行表单校验,在该例中我们将结果打印在控制台中。
来源:JavaScript中文网 ,转载请注明来源 https://www.javascriptcn.com/post/6005598181e8991b448d7137