问题标签 [react-router-dom]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
1 回答
2526 浏览

reactjs - 反应路由器未加载页面

我正在关注在线 React 教程。在教程 React Router 3 中,当我下载 React Router(和react-router-dom)时,我得到了 React Router 4。本教程中的代码如下所示。

我正在尝试重写代码以使用 React Router 4,如下所示:

User.js 的代码如下所示:

当我尝试localhost:8080/user时,它什么也没返回。

我只得到

我需要在我的代码中更改什么?

0 投票
0 回答
222 浏览

javascript - 使用 HashRouter 检查 react-router-dom 中的历史记录

如标题中所述,我正在使用 react-router-dom 和 HashRouter 在我的网站的一部分中为客户端应用程序提供服务。

我想要实现的是类似于弹出历史记录的后退按钮。这在正常情况下很好,但历史似乎包含整个浏览器历史 - 所以如果有人直接链接到一个页面并单击后退按钮,它将带他们回到上一个站点。

我希望能够检测到这种情况(即历史中的最后一件事不在哈希历史中)——这样我就可以做一些不同的事情。

在此先感谢您的帮助

马特

0 投票
2 回答
1327 浏览

reactjs - 如果没有查询字符串,react-router 重定向到 404

我是使用 react-router 的初学者,并且也会做出反应。我有一条链接到“/items”的路线,它取决于查询字符串 ex。'items?item_id=156' 并显示项目的信息。我让它像那样工作,但如果用户只访问没有查询字符串的'/items',我想显示 404。

提前谢谢你们

0 投票
1 回答
9153 浏览

reactjs - React Router v4如何仅在路径名更改时替换

我正在尝试使用 react-router v4 制作菜单导航

示例代码

问题

这段代码工作正常,但每次我点击一个链接。BrowserHistory 总是会推送新的位置,这会使浏览器无法正确后退/前进。

前任。当我点击 Home 5 次时,它应该只是按下 1 次并替换 4 次

仅在使用 BrowserRouter 时出现问题(HashRouter 正常工作)

例如:BrowserRouter
例如:HashRouter

我只想在路径不变时进行链接替换。
有可能吗?有简单的方法吗?

0 投票
0 回答
149 浏览

reactjs - 反应路由器链接输出不显示不刷新

我在我的项目中使用 react-router-dom V4.1.1,我制作了不同的组件并使用了组件导航。

但我面临一个问题,遇到一些不可预测的错误。

请让我知道我在此缺少的解决方案

索引.js

应用程序.js

菜单.js

主页.js

食谱.js

控制台中的错误

  • 警告:上下文类型失败:上下文router在 中标记为必需Link,但其值为undefined
  • 未捕获的类型错误:无法读取未定义的属性“历史”
0 投票
1 回答
390 浏览

reactjs - 在 React Router v4 中渲染 noMatch 不起作用?

这是我的代码:

该应用程序按预期在 localhost:3000/ 和 localhost:3000/index.html 中运行。但是当没有匹配时,我的 no Match 不会渲染?我正在关注此处文档中的 noMatch 教程。帮助?

0 投票
3 回答
6273 浏览

javascript - 有没有办法在外面公开路由参数零件?

如果我有这样的事情:

我的路线配置如下所示:

其中 app 只是路由和其他组件的包装器,例如:

有没有办法让 AnotherComponent 使用 match.params 或公开它们?我已经尝试使用withRouter包装组件,并将其添加为没有匹配路径的 Route,例如:

当路由为 /:someId 时,它会同时渲染 Profile 和 AnotherComponent,但 AnotherComponent 的 match.params 为空:/。

这可能吗?谢谢!

0 投票
0 回答
104 浏览

react-router - react-router V4导航问题

我的应用程序具有以下路由器设置。在 App.js 中存在以下代码。

在关于组件下,我有另一个子部门,因此我为“关于”下的组件单独保留了路由。在 About(/about) 组件中

当我单击“AboutDetails”链接时,它会路由到地址“/about/details”。然后,当我尝试将主页链接单击为“/”或“/home”组件或“/signin”组件时。它带我地址为“/about/”或“/about/home”或“/about/signin”。在地址栏中,它没有加载正确的路由 url,而不是它总是前缀“/about”组件。这个问题只有当我单击关于组件内部的组件。但不是“/about”组件。请帮助我如何解决此问题。

找到声明链接的以下标头代码。

0 投票
1 回答
550 浏览

javascript - React Router V4,使用带有高阶组件的渲染道具

我正在使用反应路由器 V4,当我声明一个路由时,我想将我的组件包装在一个高阶组件中,如果我在中使用 HOC

然后我将组件放在渲染道具中,它可以工作。当我这样做时

它返回此错误:

为什么会这样?我的 Hoc 工作正常,它返回一个有效的反应组件:

`

0 投票
0 回答
120 浏览

react-router-dom - react-router-dom (v4) 无法路由到自定义 routes.js 中提到的路径

我无法使用 react-router-dom (v4) 路由到 routes.js。

这是我的 app.jsx:

这里是 routes.js:

这是 Base.jsx:

这是我的主页(类似地,我有 SignUpPage 和 LoginPage):

当我尝试使用以下方法进行路由时,它工作正常:

我已经做了我的研究,但我不知道出了什么问题。我没有收到任何错误。只是渲染方法返回null。

截屏: 在此处输入图像描述

AYY 帮助或提示将不胜感激。谢谢