vue插件=============》vee-validate

一.  <script></script>引入的步骤

1.可以npm在命令行里输入npm install vee-validate --save 下载到一个文件夹里面

<script src="vee-validate.js"></script>

<script src="zh_CN.js"></script>

2.在js怎样加载使用

第一步引入中文包，因为默认是英文的

Vue.use(VeeValidate,{ locale: 'zh_CN' });

第二步写入自定义的-----下面为不能为空的正则

VeeValidate.Validator.extend('kongNULL', {
    getMessage:function(){
            return   '不能为空'
    },
    validate:function(value){
      return /\S/.test(value)
    }

});

3.在html语法书写了，和官网没区别

  <el-input 

        v-model="row.AppId"  

        placeholder="请输入应用ID"

        v-validate="'required|kongNULL'"********

         :class="{'input': true, 'is-danger': errors.has('应用ID') }" *******

          name="应用ID">*******

</el-input>---这个就是输入框的写法

<span v-show="errors.has('应用ID')" class="help is-danger">{{ errors.first('应用ID') }}</span>*******

以上只是点击提交前的验证

以下是包含提交时报错的完整书写

this.$validator.validateAll().then((msg)=>{
        if(msg){   }
    })

提交加上上面一句就可以了完美哈哈

清除报错； errors.clear();

   this.$validator.errors.clear();

常用验证条件

1.   after: (field, [target]) => ` ${field}必须在${target}之后`,  
2.   alpha_dash: (field) => ` ${field}能够包含字母数字字符，包括破折号、下划线`,  
3.   alpha_num: (field) => `${field} 只能包含字母数字字符.`,  
4.   alpha_spaces: (field) => ` ${field} 只能包含字母字符，包括空格.`,  
5.   alpha: (field) => ` ${field} 只能包含字母字符.`,  
6.   before: (field, [target]) => ` ${field} 必须在${target} 之前.`,  
7.   between: (field, [min, max]) => ` ${field} 必须在${min} ${max}之间.`,  
8.   confirmed: (field, [confirmedField]) => ` ${field} 不能和${confirmedField}匹配.`,  
9.   date_between: (field, [min, max]) => ` ${field}必须在${min}和${max}之间.`,  
10.   date_format: (field, [format]) => ` ${field}必须在在${format}格式中.`,  
11.   decimal: (field, [decimals] = ['*']) => ` ${field} 必须是数字的而且能够包含${decimals === '*' ? '' : decimals} 小数点.`,  
12.   digits: (field, [length]) => ` ${field} 必须是数字，且精确到 ${length}数`,  
13.   dimensions: (field, [width, height]) => ` ${field}必须是 ${width} 像素到 ${height} 像素.`,  
14.   email: (field) => ` ${field} 必须是有效的邮箱.`,  
15.   ext: (field) => ` ${field} 必须是有效的文件.`,  
16.   image: (field) => ` ${field} 必须是图片.`,  
17.   in: (field) => ` ${field} 必须是一个有效值.`,  
18.   ip: (field) => ` ${field} 必须是一个有效的地址.`,  
19.   max: (field, [length]) => ` ${field} 不能大于${length}字符.`,  
20.   mimes: (field) => ` ${field} 必须是有效的文件类型.`,  
21.   min: (field, [length]) => ` ${field} 必须至少有 ${length} 字符.`,  
22.   not_in: (field) => ` ${field}必须是一个有效值.`,  
23.   numeric: (field) => ` ${field} 只能包含数字字符.`,  
24.   regex: (field) => ` ${field} 格式无效.`,  
25.   required: (field) => `${field} 是必须的.`,  
26.   size: (field, [size]) => ` ${field} 必须小于 ${size} KB.`,  
27.   url: (field) => ` ${field}不是有效的url.