VueElementUI之Form表单验证遇到的问题-创新互联
首先说一下 我在form表单里面遇见的坑:
创新互联公司是一家专注于网站设计制作、网站制作与策划设计,元谋网站建设哪家好?创新互联公司做网站,专注于网站建设10年,网设计领域的专业建站公司;建站业务涵盖:元谋等地区。元谋做网站价格咨询:189808205751.例如我要给后台传的不是对象,而是一个数组,怎么写验证?
2.比如我有四个弹出框,都要做验证,这个时候就要注意了,每一个弹出框的ref都不能给的一样,并且一定要与当前弹框的确定或者保存按钮一一对应,例如:第一个弹框的ref='number',按钮的click比如为xxxxxx('number'),第二个弹出框的ref=‘number2',对应的按钮>>xxxxxx('number2')。如果ref用的都一样,就会出现,点击下一步我没有去做验证,我再点击上一步,再点击下一步,控制台就会报错!
官网给的列子是在model='numberValidateForm'
),注意:model绑定的必须是一个对象,如果是一个数组怎么办呢?这个下面再说,ref="numberValidateForm"
是什么呢,我要对表单进行验证,当然少不了确定或者保存按钮,名字需要和按钮一一对应,这样才能实现 点击保存的时候去验证输入框,上图!
好,接下来就要我们解决上面说的数组的问题了,如果我要传给后台的是一个数组,不是对象,我要怎么去做验证呢?直接上代码。
let flag = true; if (this.$refs[formName] instanceof Array && this.$refs[formName].length > 0) { this.$refs[formName].forEach((obj, index) => { obj.validate((valid) => { if (valid) { console.log('验证成功!'); } else { console.log('error submit!!'); flag = false; return false; } }); }); if (flag) { this.secondDialog = false; this.thirdDialog = true; } }
另外有需要云服务器可以了解下创新互联scvps.cn,海内外云服务器15元起步,三天无理由+7*72小时售后在线,公司持有idc许可证,提供“云服务器、裸金属服务器、高防服务器、香港服务器、美国服务器、虚拟主机、免备案服务器”等云主机租用服务以及企业上云的综合解决方案,具有“安全稳定、简单易用、服务可用性高、性价比高”等特点与优势,专为企业上云打造定制,能够满足用户丰富、多元化的应用场景需求。
本文题目:VueElementUI之Form表单验证遇到的问题-创新互联
标题网址:http://myzitong.com/article/dhgieo.html