How to go to a dynamic route using nuxt "to" directive

Viewed 51

This works:

<tr
   v-for="item in favourites.slice(0, 5)"
   :key="item.id"
   @click="$router.push('/items/' + item.id)"
>

But I want to write something like this because I think it looks cleaner:

<tr
   v-for="item in favourites.slice(0, 5)"
   :key="item.id"
   nuxt
   :to="`/items/${item.id}`"
>

I think it doesn't work because Nuxt just looks for "to" and doesn't understand the ":" modifier. Is there any way to achieve dynamic values in the "to" tag or do I just have to stick to first example, which is working?

1 Answers

You can use NuxtLink.

<NuxtLink
   v-for="item in favourites.slice(0, 5)"
   :key="item.id"
   tag="tr"
   :to="`/items/${item.id}`"
>
Related