NextJS路线在URL中显示[slug]

Question

我有一个带有文件夹结构的NextJS应用程序：

- pages
  - docs
   - [slug]
     - index
     - [id]
       - index

这些页面应该基于UI中出现的数据是动态的。这意味着用户可以转到/文档/付款/简介（其中付款和简介也是动态页面）。

但是，当用户在嵌套深处（文档/付款）中的一个级别时，一切正常，但是当用户达到2级深（例如DOC/付款/简介）时，所有链接都开始在其URL中显示[SLUG]。假设侧边栏中有一个链接，应该转到/doc/payments/payments/faq它开始在URL中显示/docs/[slug]/faq。 这是一个示例URL

我不知道它的发生率。

Answer 1

您需要使用[... slug] .tsx才能使用多个sl。

- pages
  - docs
   - [...slug].tsx

如果需要更多信息，请单击在这里。

Answer 2

您确定正确使用链接 s和router.push es e e es吗？使用动态sl时，应将用作 prop。这样：

<Link as="/page/docs/getting-started/creating-an-account" to="/page/docs/[slug]/[id]">
  <a>Link</a>
</Link>

或者，如果您使用路由器，则是这样：

const router = useRouter();

router.push('/page/docs/[slug]/[id]', '/page/docs/getting-started/creating-an-account');