Vue+axios实现统一接口管理的方法

import axios from "axios";
const withAxios = apiConfig => {
 const serviceMap = {};
 apiConfig.map(({ name, url, method }) => {
 serviceMap[name] = async function(data = {}) {
  let key = "params";
  if (method === "post" || method === "put") {
  key = "data";
  }
  return axios({
  method,
  url: "/api" + url,
  [key]: data
  });
 };
 });
 return serviceMap;
};
export default withAxios;

import withAxios from "../utils/withAxios";
const apiConfig = [
 {
 name: "userLogin",
 url: "/login",
 method: "get"
 },
 {
 name: "getUserInfo",
 url: "/login/user",
 method: "get"
 },
 {
 name: "getDeptList",
 url: "/login/department",
 method: "get"
 }
];
export default withAxios(apiConfig);

import GlobalService from "@/services/global";

const { data } = await GlobalService.userLogin(payload);

axios.defaults.headers.mon["Authorization"] = getCookie("jwt") || "";
// 注意此处只会在web应用初始化时配置，在登录成功后需重新配置Authorization。

axios.interceptors.response.use(response => {
 const { data } = response;
 if (data.status === -2) {
 Vue.prototype.$Message.error(`无效的登录信息或登录已失效，请重新登录`);
 delCookie("jwt");
 router.push({ path: "/login" });
 }
 if (data.status === -1) {
 Vue.prototype.$Message.error(`发生错误[${data.message}]`);
 }
 return response;
});