总结： form 校验规定&自定义校验规定

  1. 如template
<el-form ref="condFormRef" id="condForm" :model="cond" label-width="100px" size="mini" :rules="condFormRules">  <el-form-item label="估算：" prop="budget">       <el-input    style="width:60%"    v-model="cond.budget"    maxlength="15"    clearable>    </el-input>    <small>&nbsp;元</small>    </el-form-item></el-form>
  1. 在form 上定义上绑定 rules 属性， 给须要校验的item 减少prop 属性， prop 值须要个rules中的keys 保持一致
condFormRules:{  budget:[    {required: true, message: '', trigger: ['blur','change']},    {validator: validateBudget, trigger: 'blur'},  ],}

阐明：
(1) required： 是否必填， true则显示红星星， 当设置了必填时， 必须有message, 哪怕为空，否则不填时给默认提醒"budget is required"

留神： 如{message: 'aaaaaaaa', trigger: ［"blur","change"］},  没有required，则会校验，但上次校验失败的信息不会主动隐没， 即要有message时， 必须有required

(2) trigger: 可选［"blur","change"］触发执行校验的事件 blur：失去焦点时， change：数据扭转时

     this.$refs.condFormRef.validate() 时，trigger都会执行

(3) validator：自定义校验属性，能够定义本人的校验规定，如validateBudget自定义的规定函数, 校验逻辑简单时能够自定义函数实现。
如下校验逻辑简单的：要求数字且正整数或最多带两位的小数

var validateBudget=(rule, value, callback) => {      if(!value || !Number(value)){ //不输出或输0.0或0.00时，都进入        callback(new Error('请输出估算'));      }      else if(!(/(^[1-9]\d*(\.\d{1,2})?)$/.test(value) || /(^[0](\.\d{1,2}){1})$/.test(value))){        callback(new Error('请输出正整数或最多带两位的小数'));              }            else{        callback();      }    };

简略时，能够间接写在模板中, 如限度输出数字

<el-input  style="width:60%"  v-model="cond.budget"  maxlength="15"  @input="cond.budget = cond.budget.replace(/[^\d]/g, '')" //非数字的全局替换成空  clearable>  </el-input>