elementUI form表单联动验证以及添加自定义验证规则

一、表单联动验证

需求:两个formitem,其中一个是select,另外一个是input,要求在选择select时触发input的validator。

实现:this.$refs.ruleForm.validateField("sysTrackCode");[其中“sysTrackCode”为需要触发的表单项的prop值]

官方文档:https://element.eleme.cn/#/zh...

elementUI form表单联动验证以及添加自定义验证规则_第1张图片

二、添加自定义验证规则

rules: {
         selectedPayWay: [{ validator: selectPayWay, trigger: "change" }],
         sysTrackCode: [{ validator: verify, required: true, trigger: "blur" }]
       },

selectedPayWay和sysTrackCode写在data里,return外。需要注意的是,在自定义规则里,无论是成功还是失败都需要调用callback函数,
在失败时调用callback(new Error(msg)),在成功时调用callback(),否则可能导致提交表单的methods不被调用(methods指validate,一般在点击submit时调用,调用方法:this.$refs[formName].validate

你可能感兴趣的:(前端,vue.js)