Unable to catch exceptions when using axios.all

user_291224 0
Viewed 241

I am using axios.all to send few consolidated requests.

I am using .map to create the axios requests and pass them to axios.all.

 function updateCircuitTrayData(newCircuitTrays, updatedCircuitTrays, deletedCircuitTrays, config) {
        const newReqs = newCircuitTrays.map(b => axios.post(`/`, b, config));
        const modifiedReqs = updatedCircuitTrays.map(b => axios.put(`/`, b, config));
        const deleteRequests = deletedCircuitTrays.map(b => axios.delete(`/`, b, config));
      return axios.all([newReqs, modifiedReqs, deleteRequests]);
    }
    updateBrandData(newCircuitTrays, updatedCircuitTrays, deletedCircuitTrays,  config)
    .then(
        axios.spread((...response) => {
            // tslint:disable-next-line:no-console
            console.log(`Data`, response);
        })
    )
    .catch(err => {
        // tslint:disable-next-line:no-console
        console.log(`Err`, err);
    });

The API are being called. However , onError , it never comes inside catch block. Also for success calls, I am using axios.spread. But when I look inside response[0], I see a promise, not the resolved values.

What am I missing?

promise axios reactjs asynchronous javascript
1 Answers

newReqs, modifiedReqs and deleteRequests are arrays of axios requests. According to the docs, you cannot pass arrays inside an array to axios.all.

You can, however, spread each of the inner arrays and pass the resulting flattened array to axios.all():

return axios.all([...newReqs, ...modifiedReqs, ...deleteRequests]);
user_37616280
Related