axios同时调用多个接口后处理数据，axios.all调用动态循环请求（附上promise.all）

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

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

 简单来写就是：

 

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

 //  业务模拟：现在需要调用一个接口多次，当碰到接口返回值为'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)
          }
        })
      }));

上面假设三个接口第一个返回是'ok',第二个返回‘no’，第三个返回'ok'；

1. 当执行第一个接口时，进入if判断，打印一次1
2. 当执行第二个接口时，不是返回ok，不进入if语句，所以不打印
3. 当执行第三个接口时,返回ok，但是num不等于0，所以不进入if语句,不打印

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

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