CODEWITHSUNDEEP
vue.jsroutes
Atousa Darabi
Atousa Darabi

Reputation: 937

How get the param from url on Vue.js and use it in router file?

I have router file, which contains all my routes.

Here is an example on one route:

    path: '/events/:step',
    children: [
      {
        path: '',
        name: 'event.step',
        components: {
          default: Event,
          sidebar: EventSidebar
        }
      }
    ],
    props: {
      default: ({ params, query: { id } }) => ({ id, ...params })
    },
    components: {
      header: () => import('NavBar'),
      default: () => import('Event')
    },
    async beforeEnter(to, from, next) {
      if (step === 'login') { // can't find step
        // do something
      }
      next()
    }

I need to get the step param from route and if it is login do something in beforeEnter function. How can I get it?

Upvotes: 0

Views: 1025

Answers (2)

Esa Kian
Esa Kian

Reputation: 281

You can register global before guards using router.beforeEach:

router.beforeEach((to, from, next) => {
  if (['Login', 'Signup'].includes(to.name) && logged_in)
    next({ name: 'Home' })
  else next()
})

https://router.vuejs.org/guide/advanced/navigation-guards.html

Upvotes: 1

gagz
gagz

Reputation: 211

To get params from route you need to use to.params or from.params, if you want to access path you can get it from to.path or from.path depends what you need.

More info on https://router.vuejs.org/api/#routelocationnormalized

Upvotes: 1

Related Questions