如何封装请求参数和返回响应结构完全相同的多个请求

多个axois请求,这些请求的请求参数相同,响应数据的结构也完全相同,只是请求路径不同,该如何封装这些请求,降低代码的重复率。

img

可以使用Promise.all()方法,将多个axios请求合并成一个Promise数组,通过Promise.all()方法可以将多个不同的异步调用合并成一个异步调用,然后在统一的回调函数中接收所有的响应:

let requests = [
    axios.get('/path1', { params: params }),
    axios.get('/path2', { params: params }),
    axios.get('/path3', { params: params })
];

// 将多个请求合并成一个Promise数组
Promise.all(requests)
    .then(function(responses) {
        // 所有响应结果都存放在此数组中
        console.log(responses);
    })
    .catch(function(error) {
        console.log(error);
    });

将其定义并封装为一个公用函数,在需要的时候调用即可

function doAxois(url, params = {},  method = 'POST') {
  axios({
        method: method,
        url:url,
        data:params
       }).then(response=>{
            // 解析数据
           console.log(response);
       })
}

// 需要的时候调用
let url = "";
let paramas = [];
doAxois(url, params)