如果来自不同的路由，react-router-hash-link 不起作用答案

【问题标题】：react-router-hash-link doesn't work if coming from a different route如果来自不同的路由，react-router-hash-link 不起作用
【发布时间】：2018-12-20 08:33:06
【问题描述】：

我正在使用react-router-hash-link 前往同一路线内的不同路段：

import { HashLink as Link } from "react-router-hash-link";

在渲染中：

render() {
     <Link smooth to="#header2">
        Scroll to header 2 section
     </Link>
     <h2 id="header2"></h2>
}

这行得通。但是，如果我来自不同的路线并使用哈希链接到另一条路线，它不会滚动到该部分。

例如现在我在/routeone

render() {
   <Link smooth to="/routetwo#header2">
      Go to Route Two, header 2 section
   </Link>
}

在此示例中，我还在 /routeone 中导入了 HashLink。

有什么遗漏吗？

【问题讨论】：

您是否按照 react-router-hash-link 文档中的说明填充了您的应用程序？参考：github.com/iamdustan/smoothscroll
我删除了'smooth'只是为了测试，它似乎向下滚动但滚动位置完全关闭..（如果同一页面，滚动位置还可以）。 @Fawaz
也许您可以添加一个解决方法，以移动到 componentDidMount 上的特定哈希。我在处理粘性条时遇到了类似的问题，所以必须这样做。
问题依然存在。这可能是包中的一个错误。

标签： reactjs react-router react-router-v4 react-router-dom

【解决方案1】：

而不是<h2 id="header2"></h2>，如果你保留 <a id="header2"></a> 有效。

【讨论】：