Vue3 Axios 封装：简化 API 请求

以下是一个简单的封装 axios 的示例：

import axios from 'axios';

const request = axios.create({
  baseURL: 'http://localhost:3000', // 设置请求的基础URL
  timeout: 5000, // 设置请求超时时间
  headers: {
    'Content-Type': 'application/json' // 设置请求头
  }
});

// 添加请求拦截器
request.interceptors.request.use(
  config => {
    // 在发送请求之前做些什么，如添加token
    return config;
  },
  error => {
    // 对请求错误做些什么
    return Promise.reject(error);
  }
);

// 添加响应拦截器
request.interceptors.response.use(
  response => {
    // 对响应数据做些什么，如处理错误码
    return response.data;
  },
  error => {
    // 对响应错误做些什么
    return Promise.reject(error);
  }
);

 export default request;

在这个示例中，我们首先创建了一个 axios 实例，并设置了一些默认的请求配置，如基础 URL、超时时间和请求头。

然后，我们通过 request.interceptors.request.use() 和 request.interceptors.response.use() 方法添加了请求和响应拦截器，以便在请求和响应过程中进行一些自定义操作，例如添加 token 或处理错误码等。

最后，我们导出了封装好的 request 实例，供其他模块使用。在其他模块中，我们只需要引入 request 实例，然后通过它来发起请求即可。例如：

import request from './request';

request.get('/users').then(res => {
  console.log(res);
}).catch(err => {
  console.log(err);
});