表单异步验证js库:async-validator

JavaScript018

表单异步验证js库:async-validator,第1张

async-validator 是一个表单的异步验证的第三方库,它是https://github.com/tmpfs/async-validate 的演变。也是 element-ui 中的form组件所使用的验证方式。

基本用法包括定义一个descriptor,将其分配给schema,并将要验证的对象和回调函数传递给schema创建出来的validator的validate方法:

该方法将返回Promise对象,如:

传递给validate或asyncvalidate的选项将传递给验证函数,以便您可以在验证函数中临时引用数据(例如模型引用)。但是,某些选项名是保留的;如果使用选项对象的这些属性,它们将被覆盖。保留的属性是消息、异常和错误。

针对单个字段测试多个验证规则通常很有用,这样可以使规则成为对象数组,例如:

要使用的验证程序的类型,识别的类型值如下:

boolean,是否必填

模式规则属性表示正则表达式,该值必须匹配才能通过验证。

使用min和max属性定义范围。对于字符串和数组类型,将根据长度进行比较,对于数字类型,数字不得小于min,也不得大于max。

验证字段的确切长度。对于字符串和数组类型,对length属性执行比较,对于数字类型,此属性指示数字的完全匹配,即,它可能仅严格等于len。如果len属性与最小和最大范围属性组合,则len优先。

枚举,要从可能值列表中验证值,请使用带有枚举属性的枚举类型,列出该字段的有效值。

空白,通常将仅包含空格的必填字段视为错误。要为仅包含空格的字符串添加其他测试,请将空白属性添加到值为true的规则。规则必须是字符串类型。

如果需要验证深层对象属性,则可以通过将嵌套规则分配给规则的fields属性来为对象或数组类型的验证规则执行此操作。

深度规则验证为嵌套规则创建架构,因此还可以指定传递给schema.validate()方法的选项。

父规则也会被验证,因此如果您有一组规则,例如:

并提供 {roles: ["admin", "user"]} 这样的源对象,将会创建两个错误。一个用于数组长度不匹配,另一个用于索引2处缺少的必需数组项。

defaultField属性可与数组或对象类型一起使用,以验证容器的所有值。它可以是包含验证规则的对象或数组。例如:

有时需要在验证之前转换值,可能是为了强制价值或以某种方式对其进行消毒。为此,请将验证规则添加到转换有时需要在验证之前转换一个值,可能是强制值或以某种方式对其进行清理。为此,请向验证规则添加转换函数。该属性在验证之前被转换,并重新分配给源对象,以在适当的位置改变该属性的值。

如果没有转换函数,验证将失败,因为模式不匹配,因为输入包含前导空格和尾随空格,但通过添加转换函数验证传递,同时清理字段值。

消息,根据您的应用程序要求,您可能需要i18n支持,或者您可能更喜欢不同的验证错误消息。实现这一点的最简单方法是将消息分配给规则:

消息可以是任何类型,例如jsx格式。

消息也可以是一个函数,例如,如果使用vue-i18n:

对于不同的语言,可能需要相同的模式验证规则,在这种情况下,为每种语言复制模式规则是没有意义的。在这个场景中,您只需为该语言提供您自己的消息并将其分配给模式:

如果要定义自己的验证函数,最好将消息字符串分配给消息对象,然后通过验证函数内的options.messages属性访问消息。

异步验证器,您可以为指定字段自定义异步验证函数:function(rule, value, callback)

验证器,您可以为指定字段自定义验证函数:function(rule, value, callback)

验证编码这种需求操作一般用正则表达式

水库代码由11位数字和字母“四部分”组成,格式为ABTFFSSNNNY,A为1位字母,表示工程类别,取值为B;BTFFSS表示水库所在的河流水系,取值执行SL 249-2012的规定;NNN为3位数字或字母,表示该水系分区内某个水库的编号,N取值范围为0~9、A~Y;Y为1位数字,表示水库类别,取值按表1的规定执行。

更具上面的提示和你的需求 js var patt = /正则表达式/  就可处理

validator.js是一个对字符串进行数据验证和过滤的工具库,同时支持Node端和浏览器端,github地址是 https://github.com/chriso/validator.js

主要API如下:

验证str中是否含有seed

验证是否相等

验证str是否是一个指定date之后的时间字符串,默认date为现在,与之相反的是isBefore方法

检查是否是布尔值

检查是否是信用卡

检查str是否是一个可以被number整除的数字

检查是否是邮件地址

检查字符串是否为空

是否是域名

是否是浮点数

是否是哈希值

是否是十六进制颜色值,例如#ffffff

是否是十六进制数字

是否是IP地址值,version为4或者6

是否是ISBN号,version为10或者13

是否是整数

使用JSON.parse判断是否是json

判断字符串的长度是否在一个范围内,options默认为{min:0, max: undefined}

是否小写

是否是MAC地址

是否是MD5加密的哈希值

是否是MIME type值

是否是MongoDB的id值

是否仅仅包含数字

是否是一个端口号

是否是一个URL地址

是否大写

是否匹配,利用match方法,其中匹配的模式可以作为第三个参数,当然也可以卸载正则表达式pattern中

移除黑名单中的字符

对< > & ' " /进行HTML转义,与之相反的方法是unescape

对字符进行左缩进,与之对应的右缩进为rtrim方法,两端缩进trim

此外还有toBoolean、toDate、toFloat、toInt、whitelist