[Vuejs]-Vue.js v-link not working

4πŸ‘

βœ…

For Vue 1.x and Vue-router 0.7:

You are passing the path of the route as name. Give a name attribute to your route β€˜/bewerk/rit/:rideId’.
Eg:

router.map({
  '/bewerk/rit/:rideId': {
    name: 'bewerk_rit', // give the route a name
    component: { ... }
   }
})

And in your html:

<a v-link="{ name: 'bewerk_rit', params: { rideId: ride.id }}">Bewerk</a>

Refer: https://github.com/vuejs/vue-router/blob/1.0/docs/en/named.md

Update: For Vue 2.0 and Vue-Router 2.0:

<router-link :to="{ name: 'bewerk_rit', params: { rideId: ride.id }}">
  Bewerk       
</router-link>

Refer: https://router.vuejs.org/en/essentials/named-routes.html

πŸ‘€Deepak

1πŸ‘

Another way is using path:

<a v-link="{ path: '/bewerk/rit/' + ride.id }">Bewerk</a>
πŸ‘€David

Leave a comment