VueJS | How to get access to Router Parameter in my Component

you can use in component

this.$route.params.id

You should simply use $route.params.id or this.$route.params.id.

Read more : https://router.vuejs.org/guide/essentials/dynamic-matching.html

You should consider using props : https://router.vuejs.org/en/essentials/passing-props.html


While soju's answer is correct, I tend to use the method in which the docs refer to as 'decoupling the router using props'.

This can be accomplished by add the props: true option to your route and defining a property in your component.

So in your Route you would have:

export default new Router({
     routes: [{
          path: '/entry/:id',
          name: 'Entry',
          component: Entry,
          props: true
     }]
})

Then in your component you add a prop:

Vue.component('Entry', {
       template: '<div>ID: {{ id}}</div>',
       props:['id']
})

This can all be found in the docs: Passing Props to Route Components