1,校验的form对象中,包含数组,对数组进行循环
<template>
<div class="hello">
<el-form ref="form" :model="form" :rules="rules">
<!-- 对form中的数组进行校验 -->
<div v-for="(item, index) in form.list" :key="index">
<el-form-item
label="姓名"
:prop="`list[${index}].name`"
:rules="{ required: true, message: '请输入姓名', trigger: 'blur' }"
>
<el-input v-model="item.name" />
</el-form-item>
</div>
<el-button type="primary" @click="submitHandle"> 保 存 </el-button>
</el-form>
</div>
</template>
<script>
export default {
name: "test",
data() {
return {
form: {
list: [
{
name: "",
age: "",
},
{
name: "",
age: "",
},
],
},
rules: {},
};
},
methods: {
submitHandle() {
this.$refs["form"].validate((val) => {
if (val) {
console.log("校验成功");
} else {
console.log("校验失败");
}
});
}
},
};
</script>
2.对数组中的输入框进行多个条件的校验: