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

2021年9月7日 6点热度 0条评论 来源: 北漂的菜小白

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


phone:[/(^$)|^1\d{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}|0\d{1}|1[0-2])([-\/](\d{1}|0\d{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是校验必填,多种校验规则之间用 | 间隔,这个竖线是或,不是拼音的棍!!!

附注:
如果你觉得本篇记录有用,点个赞吧

    原文作者:北漂的菜小白
    原文地址: https://blog.csdn.net/weixin_42321034/article/details/93381030
    本文转自网络文章,转载此文章仅为分享知识,如有侵权,请联系管理员进行删除。