一、遍历表单校验规则实现案例
prop内容为‘遍历数据.’+index+‘.校验数据’
<div class="modelBox" v-for="(key, index) in form.list" :key="index">
<el-form-item label="课时:" :prop="'list.' + index + '.hours'" class="leftNumber" :rules="{
required: true,
message: '课时不能为空',
trigger: 'blur',
}">
<el-input-number v-model="item.hours" style="width: 270px; max-width: 100%" :precision="0" controls="false" :min="1" :max="99999" placeholder="请输入课时"></el-input-number>
</el-form-item>
</div>
二、嵌套遍历表单校验规则实现案例
prop内容为‘父级遍历数据.’+key+‘.子级遍历数据.’+index+‘.校验数据’
<div v-for="(item,keyI) of form.goodsList" :key="keyI">
<div class="modelBox" v-for="(key, index) in item.list" :key="index">
<el-form-item label="课程名称:" :prop="'goodsList.'+keyI+'.list.' + index + '.name'"
:rules="{
required: true,
message: '课程名称不能为空',
trigger: 'blur',
}">
<el-input v-model="item.name" placeholder="请输入课程名称" />
</el-form-item>
</div>
</div>
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)
