layui中使用lay-verify进行非必填项校验(踩坑篇)

踩坑一: 某些表单元素为非必填项,但是却需要校验输入数据的格式是否正确,使用的layui的lay-verify 进行校验,例如lay-verify=“phone”验证手机号码规则是否合法,但是这玩意有个坑,如果不输入数据也会认为数据不合法,所有的校验规则,默认都是必填项!!!!!最后在官方社区找到一个帖子目前问题已解决 解决办法:修改layui校验规则源码,目前没发现修改以后有什么问题 修改源码如下:

phone:[/(^$)|^1d{10}$/,请输入正确的手机号],
email:[/(^$)|^([a-zA-Z0-9_.-])+@(([a-zA-Z0-9-])+.)+([a-zA-Z0-9]{2,4})+$/,邮箱格式不正确],
url:[/(^$)|(^#)|(^http(s*)://[^s]+.[^s]+)/,链接格式不正确],
number:[/(^$)|^d+$/,只能填写数字],
date:[/(^$)|^(d{4})[-/](d{1}|0d{1}|1[0-2])([-/](d{1}|0d{1}|[1-2][0-9]|3[0-1]))*$/,日期格式不正确],
identity:[/(^$)|(^d{15}$)|(^d{17}(x|X|d)$)/,请输入正确的身份证号]

新增部分:(^$)|

踩坑二:需要修改两个文件:form.js和layui.all.js

如果该选项为必填:建议使用,lay-verify=“required|number”校验,其中required是校验必填,多种校验规则之间用 | 间隔,这个竖线是或,不是拼音的棍!!!

经验分享 程序员 微信小程序 职场和发展