问题

当我们需要调用多个接口，然后在这些接口都调用完成后进行某些操作，以及循环调用n个接口时，axios.all能帮我们很好的实现这个业务需求

解决

先看看axios官网对axios.all的用法：

简单来写就是：

image.png

然后介绍一下实际业务中的使用方法：

//  业务模拟：现在需要调用一个接口多次，当碰到接口返回值为'ok'的时候，停止调用
    let idArr = [1, 2, 3];
    let urlArr = idArr.map(element =>
      axios.get('/api/test?query=' + element)
    );
    // console.log(urlArr)
    let num = 0;
    axios.all(urlArr)
      .then(axios.spread((...arg) => {
        // 请求现在都执行完成
        Array.from([...arg]).forEach((element, index) => {
          //这里可以查看每个请求的返回数据 console.log(element)
          //通过num === 0判断是否是第一次进入if条件
          if (element.data === 'ok' && num === 0) {　　　　　　　 num+=1;
            console.log(1)
          }
        })
      }));

promise.all业务模拟：多个form表单验证

Promise.all([
      this.$refs.ruleForm.validate(),
      this.$refs.supplierForm.validate()
    ]).then(() => {
      console.log('全部验证成功')
    }).catch(() => { console.log('error submit!!'); return false; });