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/ ，可用于显示该用户的帖子列表。

具有类似用例的文件夹结构的示例。