vue同时检验两个表单后再进行提交

校验两个表单：

首先想到的方法就是 引入两个 flag 来标志两个表单验证成功，思路如下：

submitManual () {
        this.$refs.obscuredForm.validate().then(() => {
          console.log('验证成功')
          this.obscuredFlag = true //表示第一个表单验证成功
        }).catch(err => {
        // 验证失败
          console.log(err, '验证失败')
        })
        this.$refs.occludeForm.validate().then(() => {
          console.log('验证成功')
          this.occludeFlag = true  //表示第二个表单验证成功
        }).catch(err => {
        // 验证失败
          console.log(err, '验证失败')
        })
        if (this.obscuredFlag && this.occludeFlag) {
             //表示两个表单同时验证成功
            //再进行接口请求
        }
}

当然上述的方法不够优雅，此时运用ES6的Promise就可以优雅又简便的解决此问题，代码如下：

Promise.all([this.$refs.obscuredForm.validate(), this.$refs.occludeForm.validate()]).then(() => {
  //表示两个表单同时验证成功  进行接口请求操作
})