VueJS передает параметры через роутер next () - PullRequest
0 голосов
/ 13 февраля 2019

Я хочу передать последний маршрут в мой маршрутизатор, когда я нахожусь в / login, чтобы перенаправить пользователя, когда он зарегистрирован на желаемый маршрут.

Таким образом, пользователь переходит на /payment Я перенаправляю на /login и когда аутентификация в порядке, я хочу перенаправить пользователя на payement

Вот мой router.js:

import ...

Vue.use(Router)

let router = new Router({
  mode: 'history',
  base: process.env.BASE_URL,
  routes: [
    {
      path: '/',
      name: 'home',
      component: Home
    },
    {
      path: '/login',
      name: 'login',
      component: Login
    },
    {
      path: '/about',
      name: 'about',
      component: About
    },
    {
      path: '/payment',
      name: 'payment',
      component: Payment,
      meta: {
        requiresAuth: true
      }
    },
    {
      path: '/my-account',
      name: 'my-account',
      component: MyAccount,
      meta: {
        requiresAuth: true
      }
    }
  ]
})

router.beforeEach((to, from, next) => {
  console.log('Before Each Routes')
  if(to.matched.some(record => record.meta.requiresAuth)) {
    if (store.getters.isLoggedIn) {
      console.log('Logged in')
      next()
      return
    }
    console.log(to.fullPath)
    next({
      path: '/login',
      params: { nextUrl: to.fullPath }
    })
    return
  } else {
    console.log(to.fullPath)
    next()
  }
})

export default router

Итак, я установил console.log и получил это:

если я захожу напрямую в / login, вывод:

Before Each Routes
/login

Затем, если я захожу в / payment, вывод:

Before Each Routes
/payment
Before Each Routes
/login

Так что теперь, когда я идув моем компоненте входа в систему, и я использую this.$route.params.nextUrl это не определено.Параметр next() не существует, и я не знаю почему.

Что я делаю не так?

1 Ответ

0 голосов
/ 13 февраля 2019

Похоже, вы путаете два разных механизма: параметры и запрос.Параметры должны быть неотъемлемой частью URL, например /user/:id, в то время как параметры запроса добавляются автоматически.

Требуется следующее:

next({
    path: '/login',
    query: {
       nextUrl: to.fullPath,
    }
})

Связанное чтение: https://router.vuejs.org/api/#route-object-properties

...