vue表单中有表格输入如何用rules判断让表格不能为空
时间: 2024-02-09 12:12:48 浏览: 17
如果你的表格中的每个单元格都需要填写,可以在表格中设置 `required` 属性,然后在 `rules` 中使用 `required` 规则进行判断。例如:
```html
<template>
<el-form :model="form" :rules="rules">
<el-table :data="tableData">
<el-table-column prop="name" label="姓名" :required="true"></el-table-column>
<el-table-column prop="age" label="年龄" :required="true"></el-table-column>
</el-table>
</el-form>
</template>
<script>
export default {
data() {
return {
form: {
tableData: [{ name: '', age: '' }]
},
rules: {
tableData: [
{ required: true, message: '表格不能为空', trigger: 'blur' }
]
}
}
}
}
</script>
```
在上面的例子中,我们在表格中设置了 `required` 属性,然后在 `rules` 中设置了 `tableData` 的验证规则,如果 `tableData` 中的单元格有未填写的,就会触发验证失败,提示 `表格不能为空` 的错误信息。