如何在nextjs中“替换”路由而不触发重新加载？

Question

我正在以下路线之间导航：

/welcome/article/article-slug-1
/welcome/article/article-slug-2
/welcome/article/article-slug-3

动态部分是article-slug事物，它成为查询参数。

我的页面结构：

/pages
  /welcome
    /index.js
    /article
      /[slug].js

我的文章列表在/welcome和/welcome/article/slug页面上可见。

现在我做<Link href='/welcome/article/article-slug-1'/>，这将重新加载页面。我可以在“网络”标签中看到它。

如何防止页面重新加载并且仍然具有动态路由？

Answer 1

这以前是在使用动态路线时发生的。

对我而言，有效的方法是将href的值放在as中，并用href替换/welcome/article?slug=article-slug-1

所以你应该有这样的东西：

<Link 
  as='/welcome/article/article-slug-1'
  href='/welcome/article?slug=article-slug-1'
/>