Vue ElementUi同时校验多个表单(巧用new promise)
程序员文章站
2022-11-15 10:51:48
前言
有abcd四个表单,提交的时候同时校验(是的,后台管理系统的需求就是这样),巧用new promise。
实现的方法有很多种,我讲下自己觉得比较优雅的方式,欢迎各...
前言
有abcd四个表单,提交的时候同时校验(是的,后台管理系统的需求就是这样),巧用new promise。
实现的方法有很多种,我讲下自己觉得比较优雅的方式,欢迎各位大大的指正哈。
代码
let formarr=['forma','formb','formc','formd']//假设这是四个form表单的ref var resultarr=[]//用来接受返回结果的数组 var _self=this function checkform(formname) { //封装验证表单的函数 var result = new promise(function(resolve, reject) { _self.$refs[formname].validate((valid) => { if (valid) { resolve(); } else { reject() } }) }) resultarr.push(result) //push 得到promise的结果 } formarr.foreach(item => { //根据表单的ref校验 checkform(item) }) promise.all(resultarr).then(function() { //都通过了 alert('恭喜你,表单全部验证通过啦') }).catch(function() { console.log("err"); });
总结
以上所述是小编给大家介绍的vue elementui同时校验多个表单(巧用new promise),希望对大家有所帮助
上一篇: 无法拒绝的五星好评