routing with params in vuejs using router-link

You can pass params in router link using

<router-link :to="{ name: 'user', params: { userId: 123 }}">User</router-link>

Here "name" key parameter defines the name of the route and "params" key defines the parameters you need to send with that route.

If you need to use Route Path instead of Route name, You can use.

<router-link :to="{ path: 'home', params: { userId: 123 }}">Home</router-link>

Reference


Looks like params: {...} doesn't work on non-named routes so to get that working I had to make my links like this:

<router-link :to="'/view-customer/' + customer.ID">

With ES6 template literals:

<router-link :to="`/books/${book.id}`"></router-link>

Tags:

Vue.Js