diff --git a/Hoshino_FullStack_Compass.md b/Hoshino_FullStack_Compass.md index 97a9da6..a644359 100644 --- a/Hoshino_FullStack_Compass.md +++ b/Hoshino_FullStack_Compass.md @@ -264,6 +264,48 @@ export default function HomePage() { } ``` +### 02.23 +今天主要看了Next.js的路由怎么配置。 + +Next.js 采用了基于文件系统的路由机制,其中浏览器中的 URL 路径是由代码库中的文件夹及文件位置决定的。遵循约定对于正确实用路由功能至关重要。通过创建嵌套的文件夹结构,Next.js 自动路由到指定文件。这简化了创建嵌套路由的过程,并增强了应用程序的组织和结构。 + +`[]`包裹的文件夹表示动态路由。Next.js会自动渲染路由对应文件夹下的`page.txs`页面。 + + + +动态路由可以利用每个页面中提供的 `params` 对象来获取动态路由的值。 + +```tsx +export default function ProductDetail({ + params, +}: { + params: { productId: string }; +}) { + return