Vue: импортировать маршрутизатор в классе помощника и протолкнуть маршрут - PullRequest
Новая
       17

Vue: импортировать маршрутизатор в классе помощника и протолкнуть маршрут

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

Я использую Vue в первый раз и пытаюсь import мой текущий router экземпляр до JavaScript class, где я обрабатываю Authentification.

Такэто мой router файл: 

import Vue from 'vue';
import Router from 'vue-router';
import FirstRoute from '@/components/FirstRoute';
import SecondRoute from '@/components/SecondRoute';

Vue.use(Router);

export default new Router({
  mode: 'history',
  scrollBehavior() {
    return { x: 0, y: 0 };
  },
  routes: [
    {
      path: '/',
      meta: { requiredAuth: false },
      name: 'FirstRoute',
      component: FirstRoute,
    },
    {
      path: '/second',
      meta: { requiredAuth: false },
      name: 'SecondRoute',
      component: SecondRoute,
    },
  ],
});

Это мой вспомогательный class файл, в котором я пытаюсь импортировать и повторно использовать существующий экземпляр router в push a route вfunction: 

import Router from '../router'; /* This is where I import the router instance */

const globalRouter = new Router(); /* Attempt 1 */

class AuthService {
  constructor() {
    console.log(Router); /* This console.log() shows me my router instance with all routes - so it was imported the right way and works */
    const routerInClass = new Router(); /* Attempt 2 */

    this.doSomething();
  }
}

doSomething() {
  const routerInFunction = new Router(); /* Attempt 3 */

  /* Results of my attempts: */
  console.log(globalRouter); /* Result Attempt 1: undefined */
  console.log(routerInClass); /* Result Attempt 2: undefined */
  console.log(routerInFunction); /* Result Attempt 3: undefined */
  console.log(Router); /* Result Attempt 4: undefined */

  /* Use imported router to push a route */
  Router.push({ path: '/SecondRoute' }); /* Not working with attempt 1 to 4 */
}

Вариант использования, стоящий за ним: Я проверяю, истек ли auth token.Если это правда, я сохраняю текущие значения href, используя window.location.href в localStorage, и при повторном входе я перенаправляю на предыдущую страницу.Сейчас я пытаюсь использовать Router, потому что перенаправление мигает, и я надеюсь, что оно будет более плавным с `Router.

Это мои попытки, которые все провалились.Я могу зарегистрировать Router в constructor, но в моем function это всегда undefined.Я не могу сделать push там.Есть идеи?

1 Ответ

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

В вашем вспомогательном файле вам не нужно импортировать Vue или VueRouter 

import router from '../router';

class AuthService {
    constructor() {
        console.log(router);
        this.doSomething();
    }

    doSomething() {
        /* Use imported router to push a route */
        router.push({ path: '/SecondRoute' });
    }
}

РЕДАКТИРОВАТЬ: переместите функцию doSomething в вашем классе

...