欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

VUE:v-for循环出来的el-form,js如何进行总的表单验证

程序员文章站 2022-05-30 09:33:26
...

简介

页面上,会有循环多个表单并验证的需求。如下图。左侧一个菜单,一个菜单下有多个规则,一个规则一个表单(之所以没有全部用一个表单的原因是要在切换规则时,保留之前所有的验证红色提示)。
VUE:v-for循环出来的el-form,js如何进行总的表单验证

具体实现

VUE:v-for循环出来的el-form,js如何进行总的表单验证
正常一个表单的时候,直接 ref=“formName”。由于此处是多个,所以表单名也用拼接的方式来标识唯一(左侧菜单名字加表单所在的历史下标字符窜)。

注意:

在方法里面,使用this.$refs方法来进行表单的validate的时候,
千万注意!!!不能使用this.$refs.formName.validate(),
虽然在refs中能找到该表单,但是会报错 =》 validate方法undefined

但是用如下方法,是可以的。
VUE:v-for循环出来的el-form,js如何进行总的表单验证

最后

觉得有用的朋友请用你的金手指点一下赞,或者评论留言一起探讨技术!

相关标签: web前端之VUE