vue.js - Nuxt 嵌套路由

Question

我有一个使用 Nuxt 创建的基本通用应用程序。

我是 vue 和 nuxt 的新手，我正在尝试了解路由的工作原理，更具体地说是嵌套路由的工作原理。

所以我的项目结构是

├── parent
│   ├── child1.vue
│   └── child2.vue
├── parent.vue

在父页面中我有两个 child1 和 child2 的链接

<template>
    <div>
        <h3>Parent page</h3>
        <nuxt-link to="/parent/child1"> about1 page</nuxt-link>
        <nuxt-link to="/parent/child2"> about2 page</nuxt-link>
    </div>
</template>

我的目标是单击链接转到下一页，例如 /parent/child2，

但这并没有发生。当我单击链接时，它会重新打开相同的父页面。

Answer 1

移动文件 parent.vue 到 parent/index.vue