Nuxt路由多个级别

Question

有人可以解释如何使用nuxt添加多级（子级）路径。我的项目的结构是：

├root
│  ├── events
│      ├── _id.vue
│      ├── cateogries
│          └── _id.vue

基本上我的链接是这样的：

http://localhost/events

将显示事件列表

http://localhost/events/{id}

将显示事件信息以及一些类别

http://localhost/events/{id}/category/{id}

将显示事件类别信息

我尝试执行文件夹和子文件夹的结构，但无法正常工作。
我试图在事件<nuxt-child/>的_id.vue内部使用，但无法正常工作。

有人知道如何解决这个问题吗？

谢谢你。

Answer 1

首先，不要重复使用id参数，请使用其他名称。

您可以使用这样的结构：

├pages
│  ├── events
│      ├── _eid
│          ├── category
|             |__ index.vue
│             └── _id.vue

_id.vue http://localhost:3000/events/2/category/5

<template>
    <div>
    {{ $route.params }} //{ "eid": "2", "id": "5" }

    Hello from _id
    </div>    
</template>

为每个级别添加index.vue或动态的“ _”。

名称（类别或类别）也应保持一致