Next.js 路由系统

这是 Next.js 学习系列的第二篇文章。

App Router

Next.js 16 使用 App Router，基于文件系统路由：

app/
├── page.tsx           # 首页 /
├── about/
│   └── page.tsx       # /about
└── posts/
    ├── page.tsx       # /posts
    └── [slug]/
        └── page.tsx   # /posts/[slug]

动态路由

使用 [slug] 创建动态路由：

interface PageProps {
  params: Promise<{ slug: string }>;
}

export default async function Page({ params }: PageProps) {
  const { slug } = await params;
  // ...
}

上一篇文章

入门指南 - 学习 Next.js 基础概念。