vue + axios 如何处理连续请求。

Question

问题描述

现在有一个场景是：我需要发四个通道的数据请求，即请求完1号通道，有数据将其放进变量map->1，没有数据放空数据到变量map->1。在完成这一个过程之后再请求2号通道，直到4号通道请求完成。再调用完整的处理过的变量map

问题出现的环境背景及自己尝试过哪些方法

我使用过promise:但是promise在请求错误之后就不能再then下一个请求，直接进入catch；
我使用promise.all：但是只要有一个请求错误，就会返回错误，无法实现空数据在map中的站位。

相关代码

// 请把代码文本粘贴到下方（请勿用图片代替代码）

 request("/union/perfomace/getPeformanceName", {})
        .then(function(response1) {
            return request('/union/perfomace/getPeformancePlan', {peformanceName:                           response1.peformanceName[0]});
        })
        .then(function(response2) {
            return request('/union/hall/getHallInfo', {plan: response2.plans[0]});
        });
--------------------- 

你期待的结果是什么？实际看到的错误信息又是什么？

不中断4个请求中的任何一个，直到结束，再调用最后处理过的map变量。

Answer 1

自己封装一下无论如何都走then不就完了么？

function noErrorAxios(axios) {
    return new Promise(reslove => {
        axios.then(reslove).catch(err => reslove())
    })
}

Answer 2

axios.all()有这个方法

Answer 3

没有数据也不该报错走catch啊，顶多返回的数据是null之类的，自己处理下就好了，如果没有数据后端就抛异常这锅怎么也不能前端来背吧

Answer 4

我总结一下需求，如果理解有误请指出。

1. 顺序发送四个请求，无论对错。
2. 如果api返回成功，则将返回数据放到map。

3.如果api返回错误，则构造空数据放到map。

以上需求的难点无非是，你所说的，出错之后then funxtion无法执行了。看起来你好像遇到了一个前端代码问题，但根本原因在于，你不应该利用api的错误结果来推导正确的业务数据。错误就是错误，不要在此之上企图做正常数据。