路由
Nuxt 文件系统路由为 `pages/` 目录中的每个文件创建一个路由。
Nuxt 的一个核心功能是文件系统路由。`app/pages/` 目录中的每个 Vue 文件都会创建一个相应的 URL(或路由),用于显示文件内容。通过为每个页面使用动态导入,Nuxt 利用代码分割来为请求的路由提供最少量的 JavaScript。
页面
Nuxt 路由基于Vue Router并根据文件名,从 `app/pages/` 目录中创建的每个组件生成路由。
此文件系统路由使用命名约定来创建动态和嵌套路由。
-| pages/
---| about.vue
---| index.vue
---| posts/
-----| [id].vue
{
"routes": [
{
"path": "/about",
"component": "pages/about.vue"
},
{
"path": "/",
"component": "pages/index.vue"
},
{
"path": "/posts/:id",
"component": "pages/posts/[id].vue"
}
]
}
导航
`
当 `
app/pages/index.vue
<template>
<header>
<nav>
<ul>
<li><NuxtLink to="/about">About</NuxtLink></li>
<li><NuxtLink to="/posts/1">Post 1</NuxtLink></li>
<li><NuxtLink to="/posts/2">Post 2</NuxtLink></li>
</ul>
</nav>
</header>
</template>
路由参数
`useRoute()` 可组合项可以在 Vue 组件的 `