javascript - 使用 react 路由器在页面部分内导航

Question

我的导航栏包含以下内容

+------+-------+-------+
| Home | About | Login |
+------+-------+-------+

主页是具有多个部分的垂直滚动页面(例如#About 和其他部分)而登录是单独的 react 组件，它在/login 上呈现 路线。

这是我的route.js 文件

<Route path="/" component={App}>
    <IndexRoute component={Home}/>
    <Route path="/login" component={Login}/>
</Route>

我的问题是我应该如何处理页面部分内的导航更改？

目前我是这样做的:

<li>
    <Link to="/#about-us">About</Link>
</li>

和主页中的关于部分是

<div id="about-us">
    About us
</div>

这种方法的问题是当我在登录页面 (/login) 并单击主页的关于部分链接 (/#about-us) 时没有任何反应!

编辑:我正在使用 react-routerV2

Answer 1

React Router 目前不处理哈希 anchor 的滚动行为。

但是，如果您使用的是浏览器历史记录，就您而言，您可以只使用 <a href="#about-us"> , 让浏览器来处理它。