如何在不触发重新加载的情况下“替换” nextjs 中的路由？答案

【问题标题】：How do I "replace" the route in nextjs without triggering reload?如何在不触发重新加载的情况下“替换” nextjs 中的路由？
【发布时间】：2019-12-10 10:42:57
【问题描述】：

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

/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'/> 并重新加载页面。我可以在网络标签中看到它。

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

【问题讨论】：

标签： reactjs next.js

【解决方案1】：

这发生在我之前使用动态路由时。

适用于我的情况是将您的 href 值放入 as 并将 href 替换为 /welcome/article?slug=article-slug-1

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

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

【讨论】：