跳转到页面中的特定部分 -React答案

【问题标题】：Jump to a specific section in a page -React跳转到页面中的特定部分 -React
【发布时间】：2019-10-23 14:34:58
【问题描述】：

我有一个带有一些链接的页脚组件，每个链接都指向页面的特定部分，如何使链接跳转到该特定部分而不是仅路由到该页面。

<li><Link to="/about-us/#section1">Our History</Link></li> <li><Link to="/about-us/#section2">Our Mission</Link></li> <li><Link to="/about-us/#section3">Our Values</Link></li> <li><Link to="/about-us/#section4">Become a Distributor</Link></li>

我已经在目标部分使用相同标签的id 尝试了之前的代码，但它没有工作。有没有其他方法可以做到这一点。

谢谢，

【问题讨论】：

标签： reactjs react-router

【解决方案1】：

由于您使用的是 React Router，它没有内置的哈希链接支持

你可以使用这个库来代替：

https://www.npmjs.com/package/react-router-hash-link

import { HashLink } from 'react-router-hash-link';
<HashLink smooth to='/about-us/#section1' > History </HashLink>

您的部分也需要匹配 id

<div id='section1'>Hi</div>

【讨论】：