如何<link />到同一页面

Question

我正在转换一些现有代码以使用React Router。

代码目前使用<a href="#" ...>，我将其更改为<Link to=??>。

我的问题是： 我应该对"to"参数使用什么？如果我使用to="#"，应用程序将路由到＆＃34; /＆＃34;，这不是我想要的。

如果我使用当前路由名称，它会起作用，但href="#"的全部概念是代码不必知道如何访问它。

我正在使用带有history = browserHistory的React Router 2.

Answer 1

我认为你可以尝试或多或少的东西：

<Link to={window.location.pathname} hash="/#">HASH</Link>

请参阅：https://github.com/reactjs/react-router/blob/master/docs/API.md#hash

Answer 2

这是因为＆＃34; this.props.route.path＆＃34;是当前页面的路线：

<Link to={this.props.route.path} ...

请注意，如果您有嵌套的React组件，则必须传递＆＃34; this.path＆＃34;如https://facebook.github.io/react/docs/transferring-props.html

所述，从外部组件向下

Answer 3

它对我有用：

<Link className="dropdown-item" to="javascript:void()">
   Link Title
</Link>

Answer 4

<Link to='#' />

这有效，但仍会堆积您的历史记录

Answer 5

对我来说这就是解决方案：

我使用了npm模块react-router-hash-link。它很容易使用。 Docs here

import { HashLink as Link } from 'react-router-hash-link'; <Link smooth to="/#services">Services</Link>

并从npm模块<App>的{​​{1}}中包装<HashRouter>组件

stackoverflow answer

Answer 6

如果您需要转到“ /”路径的指定部分（甚至从其他路径开始），也可以使其与锚标记一起使用，如下所示：

<a href="./#your-section-id">Go to Section</a>

希望这会有所帮助。