Vue router: пустая страница после маршрутизации от перехватчика axios - PullRequest
Новая
       17

Vue router: пустая страница после маршрутизации от перехватчика axios

1 голос
/ 10 июня 2019

В моем файле axios.config.js есть этот фрагмент кода: 

    axios.interceptors.response.use(
    config => config,
    error => {
      if (error && error.message === "Network Error") {
        if (router.currentRoute.name !== "login") {
          router.push({
            name: "errorPage",
            query: { template: "NoConnection" }
          });
        }
      } else if (error && error.response && error.response.status === 401) {
        Vue.auth.logout().then(() => {
          router.push({
            name: "login"
          });
        });
      } else if (
        error &&
        error.config.hasOwnProperty("errorHandle") &&
        error.config.errorHandle === false
      ) {
        return Promise.reject(error);
      } else {
        _notifyError(error);
      }
      return Promise.reject(error);
    }
  );

Когда я получаю код состояния 401, вызывается правильный код, и маршрут меняется на: http://localhost:8080/#/error_page?template=UnAuthorized, но страницапустоЕсли я обновляюсь, я вижу страницу ошибки.

Мой маршрут: 

 {
      path: "/error_page",
      name: "errorPage",
      component: ErrorPage
 },

Есть идеи?

1 Ответ

0 голосов
/ 10 июня 2019

Попробуйте изменить router.push объект на 

router.push({
  path: "errorPage",
  query: { template: "NoConnection" }
});

Вы можете использовать query только внутри объекта router.push, если указано path, в противном случае, если вы используете name, вы должны использовать params.

Если это не сработает, попробуйте 

router.push({
  name: "errorPage",
  params: { template: "NoConnection" }
});

{
  path: "/error_page/:templateName",
  name: "errorPage",
  component: ErrorPage
},

А затем внутри вашего ErrorPage получите параметр templateName с ключевым словом $router.

...