axios的三层封装

1. axios封装第一层，第一层：对axios进行增强

import axios from "axios"; //安装引入axios

//设置公共服务器路径
axios.defaults.baseURL = "服务器";

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

// 添加响应拦截器
axios.interceptors.response.use(function (response) {
    // 2xx 范围内的状态码都会触发该函数。
    // 对响应数据做点什么
    return response;
  }, function (error) {
    // 超出 2xx 范围的状态码都会触发该函数。
    // 对响应错误做点什么
    return Promise.reject(error);
  });

//暴露进行增强后的axios
export default axios;

2.axios封装第二层：账号管理模块，所有用户管理模块的接口全都在这里进行封装

import request from "@/utils/request.js"; //引入暴露进行增强后的axios

例如登录接口封装

export const login = function (data) {
    return request({
        method: "post",
        url: "/user/Login",
        data: data,
    });
};//1.登陆
export const checkLogin = function (data) {
    return request({
        method: "post",
        url: "/users/checkLogin",
        data: data,
    });
};

3. axios第三层: 封装引入

import { login } from "@/api/user.js"; //普通引入的需要进行解构