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.

Javascript vue.js axios promise
Dec.10,2021

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())
    })
}

Previous: How to send 2D / nested Dictionary by urllib in python3

Next: Can the data in the vue component be passed to index.html?

css mysql arrays josn react html typescript webpack npm sass R objective-c .net sql-server jquery python-3.x angularjs django angular excel regex iphone ajax linux xml pandas vba spring database wordpress string wpf xcode windows bash postgresql oracle multithreading eclipse list firebase algorithm macos forms image scala visual-studio azure bootstrap spring-boot react-native python-2.7 docker performance function winforms matlab powershell apache dataframe api sqlite numpy rest shell selenium flutter dart maven loops qt swing android-studio csv express file class tensorflow sorting codeigniter perl
© 2021 CodesHelper
Advertising Contact us About us
Menu