vue elementUI form组件动态添加el-form-item rules且支持添加自定义校验方法
vue elementUI form组件动态添加el-form-item rules且支持添加自定义校验方法
组件动态添加el-form-item并且动态添加rules的方法可以参考博客:
vue elementUI form组件动态添加el-form-item并且动态添加rules必填项校验方法
添加自定义校验方法
给el-form-item添加validatePassFun方法
<el-form-item
v-for="(item, index) in form.key_list"
:prop="'key_list.' + index + '.label'"
:rules="[
{required: true, message: $t('请输入'), trigger: 'blur'},
validatePassFun('值不能重复', form.key_list, 'change'),
validatePassFun('名称不能重复', form.key_list, 'blur')
]"
:key="index">
</el-form-item>
validatePassFun
validatePassFun(msg, _data, action) {
return {
required: true,
validator: (rule, value, cb) => {
if (_data不符合校验条件) {
cb(new Error(msg))
} else {
cb()
}
},
trigger: action
}
}
(rule, value, cb) 为默认参数赋值,应该用_data和value等组合做业务逻辑校验。
原文地址:https://blog.csdn.net/qq_35517283/article/details/137690559
免责声明:本站文章内容转载自网络资源,如本站内容侵犯了原著者的合法权益,可联系本站删除。更多内容请关注自学内容网(zxcms.com)!