(element-ui)v-for动态数据循环表单验证的处理

表单验证的时候:
1:prop改为 :prop,形式为’List.’+index+’.startDate’
2:List.’+index+’.startDate就是数据结构与数据
3:每一个循环中的都需要加:rules

Dom结构如下:

<el-form
  ref="form"
  :model="form"
  :rules="ruleForm"
>
    <div v-for="(item, i) in form.list" :key="i">
        <el-form-item :prop="`list.${i}.level`" :rules="ruleForm.level" label="埋点层级:">
            <el-input v-model="item.level"></el-input>
        </el-form-item>
    </div>
</el-form>

data结构如下:rules为个表单项的验证规则

export default {
    data() {
        return {
            form: {
                list: [
                    {level: ''}
                ]
            },
            ruleForm: {
                level: [
                    { required: true, message: '请选择埋点层级', trigger: 'change' },
                ],
            }
        }
    }
}
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容