如何在同一页面内的不同文件中使用链接标签

Question

{/* nav.js */}
<li className={"li-text"}>사이트 소개</li>

{/* info.js */}
<div className="top" id='here'> 
</div>

如果您点击 nav.js 上的

标签，我想让您转到 info.js 上的#here。 但是，标签不起作用。

我尝试使用react-router，但它不能使用相同的页面。 我还能做什么？ 请帮助我。

Answer 1

尝试react-router-hash-link：

npm install react-router-hash-link

然后像这样使用：

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

// In nav.js
<Link smooth to="/info#here">
  Go to Info Section
</Link>

或者你可以尝试这样：

在您的

nav.js

中，创建指向

info.js

中特定部分的链接：

// nav.js
<a href="#here">Go to Info Section</a>

在您的

info.js

中，添加具有相应 id 的元素：

// info.js
<div id="here">
  {/* Your content */}
</div>