#nuxt.js #vue-router #router #nested-routes
#nuxt.js #vue-маршрутизатор #маршрутизатор #вложенные маршруты
Вопрос:
Это мое дерево файлов:
pages/
-index.vue (1)
-index/
--_id.vue (2)
Я ожидаю:
- если маршрут
mydomain.com
-> только для рендерингаindex.vue (1)
- если маршрут
mydomain.com/foo
-> визуализация_id.vue (2)
внутриindex.vue (1)
Когда у меня нет параметра для дочернего компонента, я хочу, чтобы дочерний элемент Nuxt вообще не отображался, но Nuxt отображал его со id
значением undefined
. Маршрутизатор Vue делает это правильно.
Это поведение, подобное поведению Nuxt в JSFiddle:https://jsfiddle.net/maxmets/95ctse8d / (строка 16 path: '/:id?'
)
Это JSFiddle, который я хочу (маршрутизатор Vue):https://jsfiddle.net/maxmets/rvmxg2f7 / (строка 16 path: '/:id'
)
Разница только в ?
символе. Когда Nuxt автоматически создает объект routes, он добавляет ?
Как заставить маршрутизатор Nuxt работать так же корректно, как маршрутизатор Vue?
Ответ №1:
Вы могли бы попробовать этот метод вложенного маршрута:
pages/
-index.vue (1)
-index/
--_id.vue (2)
--_index.vue (3)
В index/index.vue
вы можете просто отобразить пустой шаблон
<template>
<div></div>
</template>
Возможно, это не самый чистый способ сделать, но он должен выполнить работу.
или
Но если вы решите определить свой собственный маршрутизатор, вы можете проверить дополнительный модуль Nuxt Router