HTML
<!-- formFields表示需要动态生成的表单项 -->
<el-form-item v-for="item in formFields"
:key="item.field_code"
:label="item.field_name"
:prop="item.field_code"
:rules="activeRules(item)"
<!-- 使用activeRules方法返回一个对象为每一个表单项设置规则 -->
>
<!-- 双向绑定表单的表单项 -->
<el-input v-model="fromData[item.field_code]"></el-input>
</el-form-item>
复制代码
JS
activeRules (,) {
let activeRules = {
<!-- 设置验证规则,其中验证的正则是由后端提供的,存储在item里 -->
validator: (rule, value, callback) => {
if (item.field_code === '') callback(new Error(`xxx不能为空`)
else callback()
trigger: 'blur'
}
return activeRules
}
复制代码
其实实现起来不是很麻烦,就当做自己练手写写博客吧,当然里面还有一些其他坑.
最后希望能对别人有所帮助吧,这样我会灰常开心QAQ
复制代码
转载于:https://juejin.im/post/5c21f75e6fb9a049af6d4a00