【问题标题】:Next.js: How to remove # from the slug when referring to an element by idNext.js:如何在通过 id 引用元素时从 slug 中删除 #
【发布时间】:2022-01-08 19:16:45
【问题描述】:

当通过 id 引用元素时如何从 URL 中删除 #(将 domain.com/#contact 更改为 domain.com/联系方式)?

例如:点击此链接后:<Link href="about"><a>Contact</a></Link> 页面将滚动到 ID 为 #contact 的元素,并且 URL 将为 domain.com/#contact .

【问题讨论】:

  • 澄清一下,您想完全删除哈希部分/#contact,还是将其替换为/contact(不带#)?
  • @juliomalves 我想替换它。这是一个单页网页,我需要使用该部分的 ID 在此网页上导航。所以当用户点击例如导航中的联系人,它将向下滚动到联系人部分,并且 slug 将是 domian.com/contact,没有 domain.com/#contact 。最好的情况是当用户向下滚动时 slug 会自动更改(例如,用户在网站顶部 - 没有 slug:domain.com;当他向下滚动到联系人部分 - slug 将是联系人:domain.com/contact),但这不是必需的。

标签: reactjs next.js jsx


【解决方案1】:

像so<div id="contact">Contact</div>这样将id属性添加到联系人div,那么你的链接应该是这个<Link href="/about#contact"><a>Contact</a></Link>

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 2012-08-03
    • 1970-01-01
    • 2018-07-06
    • 1970-01-01
    • 1970-01-01
    • 2012-12-06
    • 2020-04-13
    • 1970-01-01
    相关资源
    最近更新 更多