摘录iview表单验证
Form 组件基于 sync-validator 实现的数据验证，给 Form 设置属性 rules，同时给需要验证的 FormItem 设置属性 prop 指向对应字段即可。
完整的验证规则请参照开源项目 sync-validator 。
验证方法也支持 Promise。
综上，我们知道了 iview 使用的是 sync-validator 。
数值方式校验
当我们使用 Form 表单校验时，如果字段使用的是 String 类型，显然通过 required:true 即可满足，但如果是数值时可就不能这么校验了，怎么办呢？
👉自定义校验
X 错误示范：
formValidate: {
money: [{ required: true, message: "金额不能为空", trigger: "blur" }]
},
✓ 自定义校验方式：
formValidate: {
money: [{ validator: validateMoney, trigger: 'blur' ,required:true }]
},
我们用到了 validator 属性，在这我们引入了自己定义的校验规则 validateMoney，该方法可以放在公共部分，具体如下：
const validateMoney = (rule, value, callback) => {
let reg =/^[1-9]{1}\d{2,}$/; // 检验规则为正则，可自行百度。
if(reg.test(value)){
callback();
}else {
return callback(new Error("请输入100及以上的整数"));
}
};
三个参数:
- rule 字段名称相对应的验证规则。始终为它分配一个 field 属性，其中包含要验证的字段的名称。
- value 表示当前输入的值。
- callback 验证完成时调用的回调函数，回传 Error 表示失败。
另外一种方式
使用提供的 pattern 属性，采用正则验证一下。
formValidate: {
money: [{ required: true, pattern: /^[1-9]{1}\d{2,}$/, message: '请输入100及以上的整数', trigger: "blur" }]
},
ok，如上两种方式应该都能满足你的需求了，采用自定义校验器方式可以得到更多支持，毕竟拿到 value 可以各种骚操作了嘛～
最后，如果觉得文章对你有所帮助，麻烦点个推荐～
分享副业
分享一下最近在做的副业，赚点外快~
image
