el-form-item v-for 校验失效
时间: 2023-02-08 21:19:58 浏览: 391
在使用 v-for 来渲染 el-form-item 时,如果校验失效可能是因为没有为每个 el-form-item 设置唯一的 prop 属性。prop 属性用来标识表单项的唯一性,如果不同的 el-form-item 绑定了相同的 prop 值,则会导致校验失效。解决方法是在 v-for 中为每个 el-form-item 设置不同的 prop 值。
相关问题
el-form-item v-for :rules 校验失效
在使用v-for循环渲染el-form-item时,需要注意:rules的值应该是一个函数,而不是一个静态的数组。这样可以确保每一项都有自己独立的校验规则。
例如:
```
<el-form-item v-for="(item, index) in items" :key="index" :rules="getRules(index)">
```
```
methods: {
getRules(index) {
return [
{ required: true, message: '请输入内容' },
{ min: 5, message: '最少输入5个字符' },
]
}
}
```
这样就可以避免出现校验失效的情况。
使用v-for循环渲染el-form-item是校验失效
使用 Vue 的 v-for 循环渲染 el-form-item 时,由于每个 el-form-item 的 key 值都相同,导致校验失效。解决方法是为每个 el-form-item 设置不同的 key 值,例如使用循环变量的索引。
```
<el-form-item v-for="(item, index) in items" :key="index">
...
</el-form-item>
```
这样就会为每个 el-form-item 设置一个唯一的 key 值,校验就可以正常工作了。
阅读全文