vue elementUI form组件动态添加el-form-item rules且支持添加自定义校验方法
- 组件动态添加el-form-item并且动态添加rules的方法可以参考博客:
- 添加自定义校验方法
- validatePassFun
组件动态添加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等组合做业务逻辑校验。