vue引入axios封装后报错,各位大佬捧捧场

引入axios文件

import axios from "axios";
import { Notify } from "vant";
import Router from "../router/router-config";
import store from "../store";

const { API_ROOT, fileServiceBaseUrl } = process.env;
// create an axios instance
const service = axios.create({
  baseURL: API_ROOT, // api的base_url
  timeout: 5000 // request timeout
});

service.interceptors.request.use(
  config => {
    // 在发送请求之前做些什么
    // 获取到全局token
    let token = getToken("token");
    // 如果全局存在token则放入到消息头中
    if (token) {
      config.headers.common["Authorization"] = token;
    }
    return config;
  },
  function(error) {
    // 对请求错误做些什么
    return Promise.reject(error);
  }
);

// 添加返回拦截器
service.interceptors.response.use(
  res => {
    return res;
  },
  error => {
    if (error.response.status === 401) {
      //清除缓存token
      clearToken("token");
      Notify({ type: "warning", message: "您还没有登录!" });
      console.log("服务器返回401");
      //更新登录状态
      store.dispatch("getUserInfo");
      //如果响应状态返回401,表示用户没有登录,进行登录
      //拿到当前的页面url,传递到登录页面,作为登录后返回的url
      Router.replace({ path: "/login", query: { url: window.location.href } });
    } else {
      Notify({ type: "danger", message: "服务器正在打怪兽!" });
    }
    return Promise.reject(error);
  }
);

export default service;

然后在api.js引入报错

import ajax from "../utils/request";

// 获取列表信息;
export const getList = () => {
  return ajax.get(`/personalized`);
};

这是报的错
image.png

不引入这个文件的话不报错
~~
~~
~~
~~
这个是引入的mian.js的内容:

import Vue from "vue";
import App from "./App";
import router from "./router/router-config";
import store from "./store";
import Vant from "vant";
import "vant/lib/index.css";
import "./assets/css/reset.scss";

Vue.use(Vant);

Vue.config.productionTip = false;

/* eslint-disable no-new */
new Vue({
  el: "#app",
  router,
  components: { App },
  template: "<App/>",
  store
});
阅读 1.3k
撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题