vue3中的axios二次封装

在Vue3中进行axios的二次封装主要包括以下几个步骤：

1. 首先，在项目中安装axios依赖，并在需要的文件中引入axios。
2. 创建一个封装axios的模块，例如request.js，并在该文件中创建并导出一个axios实例。
3. 在axios实例中进行基本的配置，例如设置请求的baseURL和超时时间等。
4. 如果需要，可以在axios实例中配置请求拦截器和响应拦截器，以处理请求前和请求后的逻辑。
5. 在需要发送请求的地方，引入封装好的axios实例，并使用该实例发送请求。

以下是一个示例代码，展示了如何在Vue3中进行axios的二次封装：

// request.js
import axios from 'axios'

const instance = axios.create({
  baseURL: 'http://localhost:8080',
  timeout: 10000
})

// 请求拦截器
instance.interceptors.request.use(config => {
  // 在请求头中携带token
  const token = localStorage.getItem('token')
  if (token) {
    config.headers['Authorization'] = 'Bearer ' + token
  }
  return config
}, error => {
  console.log(error)
  return Promise.reject(error)
})

export default instance

然后，在需要发送请求的地方，引入封装好的axios实例，并使用该实例发送请求，例如：

import request from '@/utils/request'

// 发送请求
request.get('/api/users').then(response => {
  console.log(response.data)
}).catch(error => {
  console.log(error)
})