layUI自定义校验规则

在使用layUI这款开源模块化前端 UI 框架是，如何自定义表单验证规则？
有两种写法，第一种是函数式方式，第二种是数组的形式；其大致代码已写在官网上，这里不再赘述，需要请查看 ：

form.verify({
  username: function(value, item){ //value：表单的值、item：表单的DOM对象
    if(!new RegExp("^[a-zA-Z0-9_\u4e00-\u9fa5\\s·]+$").test(value)){
      return '用户名不能有特殊字符';
    }
    if(/(^\_)|(\__)|(\_+$)/.test(value)){
      return '用户名首尾不能出现下划线\'_\'';
    }
    if(/^\d+\d+\d$/.test(value)){
      return '用户名不能全为数字';
    }
    
    //如果不想自动弹出默认提示框，可以直接返回 true，这时你可以通过其他任意方式提示（v2.5.7 新增）
    if(value === 'xxx'){
      alert('用户名不能为敏感词');
      return true;
    }
  }
  
  //我们既支持上述函数式的方式，也支持下述数组的形式
  //数组的两个值分别代表：[正则匹配、匹配不符时的提示文字]
  ,pass: [
    /^[\S]{6,12}$/
    ,'密码必须6到12位，且不能出现空格'
  ] 
});      

                               图 1.官方文档        

本文主要记录在使用过程中出现的细节问题。

函数式写法，也就是你看到的这一段：

form.varify（{
    pass: [
    /^[\S]{6,12}$/
    ,'密码必须6到12位，且不能出现空格'
  ] 
}）
这一写法需要注意三点，特别注意：这三点必须同时做到才能正确设置自定义表单验证：

1.引用这段代码之前，需要先从layUI中获取form对象，再赋值给form

    var form = layui.form
    form.verify（{
    pass: [
    /^[\S]{6,12}$/
    ,'密码必须6到12位，且不能出现空格'
  ] 
}）

图2.js中的写法

2.这段代码是需要写在js文件中的

3.layUI的引用顺序
在html文件中，layUI的引用应该放在最前的

图3.html文件中的引入

最后，当你自定义了类似上面的验证规则后，你只需要把 key（图二中的pass,若有多个key值，以“|”进行分隔） 赋值给输入框的 lay-verify 属性即可：

引用：常见的密码正则表达式 ：常见密码正则表达式 - 酷极和 - 博客园

官方文档：表单模块文档 - Layui