async-validator.js数据校验器

简介: async-validator.js数据校验器

文档:

安装

npm i async-validator

示例

// demo.mjs
// node(v16.14.0)
// import Schema from 'async-validator';
// fix: 文档给出的引入方式报错
import asyncValidator from 'async-validator';
const Validator = asyncValidator.default;
// 定义校验规则
const rules = {
  name: {
    type: 'string',
    required: true,
    validator: (rule, value) => value === 'muji',
  },
  age: {
    type: 'number',
    asyncValidator: (rule, value) => {
      return new Promise((resolve, reject) => {
        if (value < 18) {
          reject('too young'); // reject with error message
        } else {
          resolve();
        }
      });
    },
  },
};
const validator = new Validator(rules);
let data = { name: 'Tom', age: 16 };
validator
  .validate(data)
  .then(() => {
    // validation passed or without error message
    console.log('validate passed');
  })
  .catch(({ errors, fields }) => {
    console.log(errors, fields);
  });

打印出的校验信息

[
  { message: 'name fails', fieldValue: 'Tom', field: 'name' },
  { message: 'too young', fieldValue: 16, field: 'age' }
] {
  name: [ { message: 'name fails', fieldValue: 'Tom', field: 'name' } ],
  age: [ { message: 'too young', fieldValue: 16, field: 'age' } ]
}

rule的属性

type
required
pattern
len
enum
min/max

可以使用的 Type

image.png

相关文章
|
2月前
|
JavaScript 前端开发
.js方法参数argument
【10月更文挑战第26天】`arguments` 对象为JavaScript函数提供了一种灵活处理参数的方式,能够满足各种不同的参数传递和处理需求,在实际开发中具有广泛的应用价值。
50 7
|
2月前
|
前端开发 JavaScript
JS-instanceof 的实现原理
`instanceof` 运算符在前端 JavaScript 中用于检测对象的原型链是否包含指定构造函数的 `prototype` 属性。它通过遍历对象的原型链来实现。每个对象都有一个内部链接 `[[Prototype]]` 指向其原型对象,当访问属性或方法时,JavaScript 引擎会沿着原型链查找。`instanceof` 的具体实现是通过比较对象的原型链中的原型与构造函数的 `prototype` 属性,直到找到匹配的原型或到达原型链的顶端。示例代码展示了如何使用 `instanceof` 检查对象的继承关系。此外,`instanceof` 可用于验证继承关系和类型检查,支持多态性。
|
5月前
|
前端开发 JavaScript 小程序
【JS】async、await异常捕获,这样做才完美
本文通过生动的例子说明了在JavaScript中使用async/await时,不捕获异常可能导致的问题,并介绍了三种处理异步调用异常的方法:try-catch、使用Promise的`.catch`以及`await-to-js`插件库。通过这些方法,可以有效避免异常导致的程序中断,提升代码的健壮性和可读性。
92 0
【JS】async、await异常捕获,这样做才完美
|
6月前
|
JavaScript API
若依没解构送post请求出现的bug,vue.runtime.esm.js:620 [Vue warn]: Error in mounted hook: “TypeError: (0 , _inde
若依没解构送post请求出现的bug,vue.runtime.esm.js:620 [Vue warn]: Error in mounted hook: “TypeError: (0 , _inde
|
8月前
|
JavaScript
store下的getter.js什么作用
store下的getter.js什么作用
|
8月前
|
JavaScript 前端开发
JS中return的作用是什么
JS中return的作用是什么
58 0
|
8月前
|
JSON JavaScript 前端开发
js中async的作用
js中async的作用
101 0
|
设计模式 JavaScript 前端开发
JS class 并不只是简单的语法糖!
JavaScript的语言设计主要受到了Self(一种基于原型的编程语言)和Scheme(一门函数式编程语言)的影响。在语法结构上它又与C语言有很多相似。
|
前端开发
怎么使用async-validator快速校验表单
怎么使用async-validator快速校验表单
439 0
|
移动开发 小程序 JavaScript
uniapp form表单validator函数校验
uniapp form表单validator函数校验
uniapp form表单validator函数校验

热门文章

最新文章