(Vue-router) Route with name 'abc' does not exist when redirect another page with parameter in NuxtJS

Viewed 1815

I'm building project with NuxtJs(SSR type). I want to pass param when redirect another page. Based on Nuxtjs documentation, this is my structure folder

pages/
--| product/
-----| productlist.vue
-----| productadd.vue
-----| productedit/
----------| _id.vue

In productlist.vue, i want to redirect to productedit/{id} when click edit button, i used Nuxt-link to do it

<v-btn class="mr-2" small color="primary" nuxt :to="{ name: 'productedit-id', params: { id: item.id } }">
    <v-icon>mdi-pencil</v-icon>
</v-btn>

However i always get page 404 Not Found and console log [vue-router] Route with name 'productedit-id' does not exist

I don't understand why? I don't know what i missed. Please help me and i'm so grateful

1 Answers

If you want use name you must contain parent folders too:

:to="{ name: 'product-productedit-id', params: { id: item.id } }"

however personally i use static address

:to="`/product/productedit/`+item.id"

Related