[Vuejs]-Pass an image as prop in a router-link tag

So it’s a case of passing props to your route which you have to set up in your router.

const router = new VueRouter({
  routes: [
    { path: '/details/:url', component: Details, props: true },
    // ...
  ]
})

then when you use your route:

<router-link to="`/details/${url}`">Details</router-link>

In the above url is the dynamic element you would be passing to it. If it comes from a v-for loop it would be item.url or whatever you are v-for ing.

OR if you name your route you can pass a param like this:

const router = new VueRouter({
  routes: [
    { path: '/details/:url', name: 'Details', component: Details, props: true },
    // ...
  ]
})

then use it like this:

<router-link :to="{ name: 'Details', params: { url } }">
   Details
</router-link>

You can read more here