Nuxt 路由器，比 nuxt-child 更深入

Question

我正在使用 Nuxt 子组件，但也想更深地链接到子组件。

我认为这最能说明问题。

example.com/cars               <-- cars.vue (has nuxt-child)
example.com/cars/bmw/          <-- cars/_maker.vue (this is the child)
example.com/cars/ford/         <-- cars/_maker.vue (this is the child)
example.com/cars/bmw/i3        <-- cars/_maker/type.vue (shows wrong template)
example.com/cars/ford/mustang  <-- cars/_maker/type.vue (shows wrong template)

_type.vue 未呈现，而是使用_maker.vue 模板。

我没有设置扩展路由，它完全脱离了目录结构路由。

如何让/i3 和/mustang 路由使用type.vue 模板？

我认为我可以通过不使用 Nuxt-Child 并执行类似的操作来做到这一点，但我失去了良好的 Nuxt-Child 行为。

example.com/cars               <-- cars/index.vue
example.com/cars/bmw/          <-- cars/_maker/index.vue
example.com/cars/bmw/i3        <-- cars/_maker/_type.vue

Answer 1

尝试像这样在pages 文件夹上设置结构。

pages/
--| _cars/
-----| _maker/
--------| _type.vue
--------| index.vue
-----| _maker.vue
-----| index.vue
--| _cars.vue
--| index.vue

只需在_cars.vue、_maker.vue 和_type.vue 中添加<nuxt-child/>，如果不需要，请删除index.vue 文件。 .