如何使用react-router跳转到页面中的特定位置

2024-01-21

我正在尝试使用 React 和 React-router 构建一个视差网站

在我发现的大多数react-router示例中,目标dom节点被替换为与路由对应的Handler。

var routes = (
    <Route handler={App} path="/">
        <DefaultRoute handler={Home} />
        <Route name="about" handler={About} />
        <Route name="users" handler={Users} />
    </Route>
);

Router.run(routes, function (Handler) {
    React.render(<Handler/>, document.body);
});

如何将所有路由处理程序渲染到单个页面中并使用react-router跳转到页面中的特定位置?


我认为你想要使用的是<Link to="#LOCATION" />。它在文档中说to的属性Link tag: 要链接到的路由的名称或完整的 URL。。尝试一下,看看是否有效。

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

如何使用react-router跳转到页面中的特定位置 的相关文章

随机推荐

  • 使用 Python 监控 Java 应用程序 [关闭]

    Closed 这个问题正在寻求书籍 工具 软件库等的推荐 不满足堆栈溢出指南 help closed questions 目前不接受答案 I m a python程序员 并且想要监控 Java 应用程序 通过与JMX 我一直在网上搜索 但没
  • 为 iOS 编译 Qt(UIKit lighthouse)

    我一直在尝试为 iOS 编译 Qt 但我遇到了一些其他人似乎没有遇到的疯狂问题 至少根据我过去一天读到的内容 我按照这篇文章中的说明进行操作 文章网址 http labs qt nokia com 2011 08 09 update on
  • 在集合视图中删除整行后,装饰视图不会被删除

    我已经添加了装饰视图UICollectionView通过子类UICollectionViewFlowLayout Im placing decoration view under each row in collection view It
  • XGBoost 和稀疏矩阵

    我正在尝试使用 xgboost 来运行 using python 分类问题 其中我的数据位于numpy 矩阵 X 行 观察值 列 特征 和 a 中的标签numpy 数组 y 因为我的数据很稀疏 所以我想让它使用 X 的稀疏版本运行 但似乎在
  • Liferay:从 init() 获取 PortletID 和 companyID

    也许通过 init PortletConfig 中的 PortletConfig 问题是使用 PortletConfigImpl portletConfig getPortletId 不再允许 因为在 package properties
  • CSS - 如何使内部包裹有浮动的 DIV 大小仅与容纳浮动所需的大小相同?

    我有几个花车和它们周围的 DIV 该 DIV 位于另一个 DIV 内 并且应该在其中水平居中 问题是内部 DIV 不是固定宽度的 也不可能是固定宽度的 这是代码 div outer text align center div inner d
  • Jquery - 将条目添加到右键单击上下文菜单

    你可以禁用菜单 document bind contextmenu function e return false 你可以显示一个div document bind contextmenu function e menu css top e
  • .NET 生产调试

    我的 Windows 应用程序已经投入生产一段时间了 并将其设置为在抛出异常时向我们发送错误报告 其中大多数都具有相当的描述性 可以帮助我快速找到问题 我使用 MS 应用程序异常块 在某些情况下 我收到的报告是我无法重现的问题 并且似乎只发
  • 如何在各个数据点之间添加线条?

    我正在尝试在 Highcharts 中制作一个散点图 该图仅将两个单独的点相互连接 但不连接到任何其他点 显示数据点随时间的变化 Here http jsfiddle net 2MdEN 我说明我的问题 我希望点之间有一条线 20 20 a
  • 从 Android 应用程序启动 Google 地图和导航器

    我有一个 Android 应用程序 它允许用户打开谷歌地图或导航器来显示某个地址 此功能过去是有效的 但现在我收到以下错误并且应用程序崩溃 错误 AndroidRuntime 2165 android content ActivityNot
  • Windows 桌面上的 cygwin ssh 快捷方式

    我有多个需要远程访问的服务器 与 Putty 相比 我更喜欢 Cygwin 这样做 无论如何 打开我很酷的 Mintty 窗口然后输入以下命令的过程花费了太长时间 PS 我正在对这些服务器使用 密钥 身份验证 首先 我从 Windows 桌
  • 从 apache cxf REST 响应中删除空值字段

    我在用着apache cxf 2 7 11 jackson codehaus 1 9 13 spring 3 5在我的 REST 服务 Web 容器中 我想知道删除的最佳方法是什么null来自 REST 响应的值字段 例如 我的回应现在是这
  • 如何在 Dockerfile 中设置镜像名称?

    您可以在构建自定义图像时设置图像名称 如下所示 docker build t dude man v2 Will be named dude man v2 有没有办法在 Dockerfile 中定义镜像的名称 这样我就不必在docker bu
  • 子串算法

    有人可以向我解释如何迭代解决子串问题吗 The problem given two strings S S1S2S3 Sn and T T1T2T3 Tm with m is less than or equal to n determin
  • 列表中的第一项始终被选中

    我有一个项目列表 我希望能够导航到详细信息视图 但是 列表中的第一个元素始终传递给此视图 这可能是什么问题 struct ContentView View var array Object Object id init property 1
  • 排除webpack中的一些css文件

    我遇到了一个问题webpack 我的项目具有以下结构 文件夹结构 src js app js For importing app scss file vendor js For importing vendor scss file scss
  • 上下文感知合并?

    是否有任何用于编程语言的差异 合并工具 以语法感知的方式工作 如 XML Diff Tool 不仅仅是逐行比较 并且可以选择忽略空格 我感兴趣的是一个实际上遵循语言语法和定界符的程序 建议在不破坏语法正确性的情况下进行更改 或者捆绑多行分隔
  • 如何将溢出的菜单项包装到下拉列表中以创建响应式导航菜单?

    我正在制作菜单 我有一个包含许多列表项的菜单 我想要的是 当我将浏览器大小调整为小屏幕 例如笔记本电脑和平板电脑 时 我想要溢出li s折叠并显示在下拉菜单中 Actual Menu Responsive view for the same
  • 使用相同的 URL 替换弹出窗口 URL

    我需要用相同的 URL 替换 myWindow window open 弹出窗口 URL 但不知道如何操作 我相信我应该使用 setTimeout 但我不知道如何或在哪里放置它 这是我正在使用的编码
  • 如何使用react-router跳转到页面中的特定位置

    我正在尝试使用 React 和 React router 构建一个视差网站 在我发现的大多数react router示例中 目标dom节点被替换为与路由对应的Handler var routes