Next.js 中動態嵌套路由的正確文件夾結構是什么？

Question

我一直在閱讀 Next.js 文檔並認為我了解 [slug].js 動態路由過程，但我很難理解文件夾結構方面的嵌套動態路由。

如果我想制作一個基於用戶的應用程序，我將如何實現/user/[userid]/post/[postId] ？

並且想要這樣的事情：

 user
 - [id].js // e.g. user/1
 - [userId]
 - - post
 - - - [postId].js // e.g. user/[userId]/post/[postId]

但這會引發關於 [slugs] 的錯誤，因為我認為您不能在同一個文件夾中有兩個 slug。

誰能解釋正確的文件夾結構來實現這一點？ 任何幫助將不勝感激。

Answer 1

代替[id].js在[userId]文件夾中創建一個名為index.js的文件，該文件將用於渲染路由路徑/user/[userId]/的頁面。

pages/
 user/
  [userId]/
    - index.js        // will match for /user/1234
    post/
      - index.js      // will match for /user/1234/post
      - [postId].js   // will match for /user/1234/post/some-post

同樣，在post文件夾下創建index.js將有助於匹配路由路徑/user/[userId]/post/ ，可用於顯示該用戶的帖子列表。

具有類似用例的文件夾結構的示例。