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是校验必填,多种校验规则之间用 | 间隔,这个竖线是或,不是拼音的棍!!!