介绍

Laravel 的表单验证很不便，想在前端也用这样的形式进行验证。

git 地址，欢送star

期待这个表单验证库有这样的性能。

let validator = new Validation(this.registerForm, {    telephone: "required|telephone",    captcha: "required|length:5",}, {    telephone: {        required: "手机号不能为空",        telephone: "手机号格局不正确",    },    captcha: "验证码不正确"})try {    validator.validate()} catch(e) {    uni.showToast({        icon: 'error',        title: e.message    })}

构造函数的第三个参数 messages 能够不要，默认是英文提醒。而且该参数反对不同粒度的错误信息，如果传对象，则如果对应的规定校验不通过，就应用对应的错误信息；如果传字符串，则不论什么规定未通过，都应用该错误信息。

内置一些规定，如果不够用，还能够本人扩大。

依据以上的需要，就有了这个库 @church1117/form-validation。

装置

npm install @church1117/form-validation

应用

import Validation from "@church1117/form-validation"let data = {        name: "church",        mobile: "18565919379",        age: 19,        gender: '2',        password: "123456",        captcha: "12345",        idcard: '42052919910727452X',        email: "xxx@qq.com",        test: "ttt",        birthday: '1993/11/17',    }let rules = {        name: "required|between:6,255",        mobile: "required|telephone",        age: "numeric|between:8,60",        gender: "numeric|range:" + gender.join(','),        password: "required|min:6|password",        captcha: "required|length:5",        idcard: "required|idcard",        email: "email",        // test: "required|testRule"        birthday: "datetime"    }let messages = {        name: {            required: "名字不能为空",            between: "名称长度必须在6~255之间",        },        mobile: "不正确的手机格局",        age: {            numeric: "年龄不是一个无效的数值",            between: "年龄必须在18-60岁之间"        },        password: {            required: "明码不能为空",            min: "明码长度不能小于6位",            regex: "明码只能由数字、大小写字母形成",        },        captcha: "验证码不正确",        idcard: {            required: "身份证不能为空",            idcard: "身份证格局不正确",        },        test: {            required: "测试字段不能为空",            testRule: "该字段的值必须为test"        }    }let validation = new Validation(data, rules, messages);
  • messages 能够定义不同粒度的错误信息，如果是字符串，那么该字段的所有验证规定都应用该错误信息。如果是对象，就只应用对应规定的错误信息。

内置规定

  • required
  • telephone
  • min
  • max
  • between
  • idcard
  • range
  • password
  • numeric
  • length
  • email
  • datetime

自定义规定

匿名函数参数(value, field, ...params)

  • value
  • field
  • ...params
Validation.register('testRule', function(value, field) {    if (typeof value != 'undefined' && value != 'test') {        throw new Error(`${field} must equal test`)    }});

测试

npm test