記錄一次Vue + axios攔截器的問題

記錄一次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)
  }
)
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章