How vue + axios handles consecutive requests.

< H2 > problem description < / H2 >

now there is a scenario: I need to send data requests for four channels, that is, after requesting channel 1, some data will be put into the variable map- > 1, and there is no data to empty the data to the variable map- > 1. After this process is completed, channel 2 is requested until the channel 4 request is completed. Then call the fully processed variable map

< H2 > the environmental background of the problem and what methods you have tried < / H2 >

I have used promise:, but promise cannot then the next request after a request error. Go directly to catch;
I use promise.all:, but as long as there is a request error, it will return an error and cannot realize the location of empty data in map.

< H2 > related codes < / H2 >

/ / Please paste the code text below (do not replace the code with pictures)

 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]});
        });
--------------------- 
< H2 > what result do you expect? What is the error message actually seen? < / H2 >

does not interrupt any of the four requests until the end, and then invokes the last processed map variable.


axios.all () has this method


there is no data and no wrong catch should be reported. At most, the data returned is null and so on. Just deal with it yourself. If there is no data backend, you can't throw an exception at the front end. You can't memorize it at the front end.


Let me summarize the requirements, please point them out if there is any misunderstanding.

  1. sends four requests sequentially, right or wrong.
  2. if api returns success, the returned data is put into map.

3. If the api returns an error, the empty data is constructed and put into the map.

the difficulty of the above requirements is that, as you said, then funxtion cannot be executed after an error. It looks like you have a front-end code problem, but the root cause is that you shouldn't use the wrong results of api to derive the correct business data. A mistake is a mistake, so don't try to do normal data on top of it.


package yourself and go then anyway, isn't it?

function noErrorAxios(axios) {
    return new Promise(reslove => {
        axios.then(reslove).catch(err => reslove())
    })
}
MySQL Query : SELECT * FROM `codeshelper`.`v9_news` WHERE status=99 AND catid='6' ORDER BY rand() LIMIT 5
MySQL Error : Disk full (/tmp/#sql-temptable-64f5-1b310a4-2b4dd.MAI); waiting for someone to free some space... (errno: 28 "No space left on device")
MySQL Errno : 1021
Message : Disk full (/tmp/#sql-temptable-64f5-1b310a4-2b4dd.MAI); waiting for someone to free some space... (errno: 28 "No space left on device")
Need Help?