跟着up主做的,他的拦截器没问题但是我的就是不起作用。
后来在mian.js中添加了下面两行,全局引入,然后就可以了。
import axios from 'axios'
Vue.prototype.$axios = axios
放上一开始的代码:
main.js
import Vue from 'vue'
import ElementUI from 'element-ui'
import 'element-ui/lib/theme-chalk/index.css'
import App from './App'
import router from './router'
Vue.config.productionTip = false
Vue.use(ElementUI)
/* eslint-disable no-new */
new Vue({
el: '#app',
router,
components: { App },
template: '<App/>'
})
api.js
import axios from 'axios'
import { Message } from 'element-ui';
import router from '../router'
/**
* 响应拦截器
*/
axios.interceptors.response.use(success=>{
if (success.status&&success.status==200)
if (success.data.code==500||success.data.code==401||success.data.code==403){
Message.error({message:success.data.message});
return;
}
if (success.data.message){
Message.success({message:success.data.message});
}
return success.data;
},
error => {
if (error.response.code==500||error.response.code==404){
Message.error({message:"服务器跑路了!"});
}else if(error.response.code==403){
Message.error({message:"权限不足,请联系管理员!"});
}else if(error.response.code==401){
Message.error({message:"还没登录,请登录!"})
router.replace('/');
}else {
//判断返回页是否有信息
if (error.response.data.message){
Message.error({message:error.response.data.message});
}else {
Message.error({message:'未知错误!'})
}
}
return;
})
/**
* 请求封装
*/
let base='';
export const postRequest=(url,params)=>{
return axios({
method:'post',
url:`${base}${url}`,
data:params
})
}