element 对于数组对象表单校验
时间: 2024-10-22 16:26:21 浏览: 16
在Vue.js中,`element-ui`是一个流行的前端组件库,它提供了一个强大的表单验证功能。当你使用`element-ui`的数组元素(比如`el-form-item`结合`v-for`循环)来进行数据校验时,可以利用其内置的校验规则和自定义验证函数。
例如,你可以设置每个表单项的`rules`属性,对于数组类型的字段,可以用一个嵌套的对象或者数组来指定针对每个项目的验证规则。例如:
```html
<template>
<el-form :model="formData">
<el-form-item v-for="(item, index) in items" :key="index">
<el-input v-model="item.name"></el-input>
<el-form-item :prop="['items', index, 'required']">必填项</el-form-item>
<!-- 更多验证规则... -->
</el-form-item>
</el-form>
</template>
<script>
export default {
data() {
return {
formData: {
items: [{ name: '' }]
},
// 其他数据...
};
}
};
</script>
```
在这个例子中,`required`是一个内置的验证规则,表示这个字段是否为空。对于自定义验证,你可以使用`validateField`方法或`validateFields`方法。
阅读全文