記錄一次Vue+axios登錄攔截器的問題,最近在寫Vue的登錄攔截器,出現一些問題,在error中使用iview的Message消息提醒時一直出現問題,但是沒有報錯信息,(沒有報錯信息最致命的問題),後來try cache後發現是this的問題。
使用了N中方法解決this的指向問題,一直沒有解決,後來想到使用js的原型鏈的方式,沒想到解決了
axios.interceptors.response.use(
response => {
return Promise.resolve(response)
},
error => {
if (error.response) {
try {
switch (error.response.status) {
case 401:
Vue.prototype.$Message.warning(
{
content: error.response.data.msg,
duration: 5
}
)
router.replace({
path: '/',
query: {redirect: router.currentRoute.fullPath} // 登錄成功後跳入瀏覽的當前頁面
})
break
case 403:
Vue.prototype.$Message.warning({
content: error.response.data.msg,
duration: 5
})
router.replace({
path: '/',
query: {redirect: router.currentRoute.fullPath} // 登錄成功後跳入瀏覽的當前頁面
})
break
case 500:
Vue.prototype.$Message.error({
content: '服務器出現問題',
duration: 5
})
break
case 404:
// 跳轉到404頁面
router.replace({
path: '/'
})
}
} catch (e) {
console.log(Vue.prototype.$Message)
}
}
return Promise.reject(error.response.data)
}
)