Дочерние динамические страницы NuxtJS не переходят на / рендеринг с помощью Nuxt-ссылки

Question

Если моя файловая структура:

- pages
-- catrules.vue
-- catrules/
---- _id.vue

Дочерняя страница не отображается (но URL-адрес обновляется, и страница остается на родительской):<nuxt-link :to="'/catrules/' + catrule.slug">{{ catrule.ruleid }}</nuxt-link>

Если я изменю имя каталога catrules к catrule, то все работает как положено:

- pages
-- catrules.vue
-- catrule/
---- _id.vue

<nuxt-link :to="'/catrule/' + catrule.slug">{{ catrule.ruleid }}</nuxt-link>

Answer 1

Вы должны использовать эту структуру:

- pages
-- catrules/
---- _id.vue
---- index.vue

Так что просто переименуйте свой pages/catrules.vue в качестве pages/catrules/index.vue

см. https://nuxtjs.org/guide/routing