vue3 axios接口封装

以下是在Vue3中封装axios接口的步骤：

1. 首先，在项目中安装axios：

npm install axios

2. 在src目录下创建一个api目录，并在其中创建一个request.js文件。

3. 在request.js文件中引入axios：

import axios from 'axios';

4. 创建一个axios实例，并进行相应的配置：

const service = axios.create({
  baseURL: process.env.VUE_APP_BASE_API, // 根据实际情况配置baseURL
  timeout: 5000, // 设置超时时间
});

5. 添加axios请求拦截器，可以在请求发送前进行一些处理：

service.interceptors.request.use(
  config => {
    // 在发送请求之前做些什么
    // 可以添加请求头、设置token等
    return config;
  },
  error => {
    // 对请求错误做些什么
    return Promise.reject(error);
  }
);

6. 添加axios响应拦截器，可以在接收到响应后进行一些处理：

service.interceptors.response.use(
  response => {
    // 对响应数据做些什么
    // 可以对返回的数据进行处理、统一错误处理等
    return response.data;
  },
  error => {
    // 对响应错误做些什么
    return Promise.reject(error);
  }
);

7. 最后，将封装好的axios实例导出，以便在项目中使用：

export default service;

这样，你就可以在项目中使用封装好的axios实例进行接口请求了。