定义路由
我们建议在继续之前先阅读 路由基础 页面。
本页将指导你如何在 Next.js 应用程序中定义和组织路由。
创建路由
Next.js 使用基于文件系统的路由器,其中文件夹用于定义路由。
每个文件夹代表一个映射到 URL 段的路由段。要创建嵌套路由,你可以将文件夹嵌套在一起。
使用特殊的 page.js
文件 可以使路由段公开访问。
在这个例子中,/dashboard/analytics
URL 路径是不可公开访问的,因为它没有对应的 page.js
文件。这个文件夹可以用来存储组件、样式表、图片或其他相关文件。
值得注意的是:特殊文件可以使用
.js
、.jsx
、.ts
或.tsx
文件扩展名。
创建 UI
使用特殊文件约定来为每个路由段创建 UI。最常见的是页面,用于显示特定于路由的 UI,以及布局,用于显示在多个路由之间共享的 UI。
例如,要创建你的第一个页面,在 app
目录中添加一个 page.js
文件并导出一个 React 组件: