Vue ElementUi同时校验多个表单(巧用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)，希望对大家有所帮助