可以查看axios的中文文档，地址如下
https://www.axios-http.cn/

为什么要对axios进行二次封装：

由于自带的axios不能满足我们的需求，需要对其进行二次封装，方便程序员使用

  1. // 引入axios
  2. import axios from 'axios'
  3. // @ts-ignore
  4. import { ElMessage } from "element-plus";
  5. import (GET_TOKEN) from './token.ts'
  6. // 第一步：利用axios对象的create方法，去创建axios实例（其他的配置:基础路径、超时时间）
  8. const requeset = axios.create({
  9.   // 基础路径
  10.   baseURL: import.meta.env.VITE_APP_BASE_API,//后期可以换成自己的项目地址
  11.   // 设置超时时间
  12.   timeout: 5000,
  13. })
  15. // // 第二步：给request实例添加请求拦截器
  16. requeset.interceptors.request.use((config)=>{
  17.   //获取token
  18.   const token = GET_TOKEN()
  19.   if(token){
  20.     config.header.token = token
  21.   }
  23.   // 返回配置对象
  24.   return config;
  25. })
  28. // 第三步：给request实例添加响应拦截器
  29. requeset.interceptors.response.use((response)=>{
  30.     // 成功的回调
  31.     // 简化数据
  33.     return response.data
  34.   },
  35.   (error)=>{
  36.     // 失败的回调：处理http网络错误
  37.     // 定义一个变量，存储网络错误信息
  38.     let message = '';
  39.     // http状态码
  40.     let status = error.response.status
  41.     switch(status){
  42.       case 401:
  43.         message = 'TOKEN过期';
  44.         break;
  45.       case 403:
  46.         message = '无权访问';
  47.         break;
  48.       case 404:
  49.         message = '请求地址错误';
  50.         break;
  51.       case 500:
  52.         message = '服务器出现问题';
  53.         break;
  54.       default:
  55.         message = '网络出现错误';
  56.         break;
  57.     }
  58.     // 提示错误信息
  59.     ElMessage({
  60.       type:'error',
  61.       message
  62.     })
  63.     return Promise.reject(error);
  64.   }
  65. )
  67. // 对外暴露
  68. export default requeset;