问题标签 [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 投票
3 回答
10659 浏览

reactjs - 反应道具类型错误

我正在尝试在 codepen 中创建网络应用程序。我正在使用 React,ReactDOM。一切都很好。但是当我将 react-router-dom 添加到我的项目时,我收到了一个错误:

我怎样才能解决这个问题?

0 投票
1 回答
1674 浏览

javascript - 如何使用 React Router v4 访问 React 应用程序之外的历史实例?

我有一个 React 应用程序,它共享一个外部脚本文件以使用 vanilla JS 构建公司范围的标题。在该标头中是一个徽标,该徽标动态绑定到调用它的任何应用程序的根目录 ( location.origin)。

捕获点击导航并使用 React Router v3 之前是微不足道的,因为在您设置路由的任何地方都可以访问 browserHistory:

使用 React Router v4 ( react-router-dom),我如何在不将侦听器绑定到组件内部某处并使用的情况下完成此操作props.history

0 投票
1 回答
469 浏览

reactjs - 在 React-Router-Dom 中,我的链接正在更改 url,但它没有呈现匹配的组件或将任何道具传递给 this.props.child

这是在 ReactDOM.render[index.js] 里面

#下面的代码在App.js中

上面的代码在Footer.js[Link used]

上面的代码在footer.js里面

0 投票
2 回答
3011 浏览

javascript - React Router Switch 组件匹配

在此处的反应路由器文档中,它说:

考虑这段代码:

如果 URL 是/about, 那么<About>,<User><NoMatch>都将呈现,因为它们都与路径匹配。

它们如何匹配路径/about?我不明白为什么这是真的,除非用户有 username about。我错过了什么?

0 投票
2 回答
2860 浏览

react-router - react-router-dom - 直接导航到路由

使用 react-router-dom 时,我是否可以通过在 URL 中手动输入路径来创建路由并导航到它?

所以,我将在 localhost 上,当我手动输入 ' /prequote' 到结尾时,urlnavbar不会重定向到我指定的组件,而是抛出 404。

这是预期的行为吗?

我一直在寻找答案,并看到一些建议配置 webpack(我正在使用 webpack)devServer.historyApiFallback = true应该可以工作,但它对我没有用。

0 投票
0 回答
494 浏览

javascript - 如何使用 react-router-dom v4 保护一个管理页面?

我正在创建一个具有不同页面的网站。它在前端使用 React.js,在后端使用 Express。基本上它是一个 MERN 堆栈。

对于导航,我使用 react-router-dom v4。路由就像一个魅力。现在我必须保护一页。我已经尝试使用 reacttraining.com 文档,但没有成功。

我的 App.js:

我的问题的正确解决方案是什么?'/dashboard' 需要受到保护,只有在您登录时才能看到。

感谢您的帮助;)

0 投票
1 回答
793 浏览

redux - 通过调度 redux 操作(使用 react-router-dom)更新路由器的历史位置

我有一个看起来像这样的路由器

Route里面有很多这样的<Switch>。当用户单击按钮/链接时,我正在使用 redux 处理状态并从某些组件调度异步操作。

现在,我面临的问题是,即使 history.push 更新了 url 并将我导航到 'something.do?phase=something',但我没有看到 Route 的 history.location 得到更新。因此(我认为),当我单击页面“something.do?phase=something”上的某个链接时,只有页面的 url 发生变化,但不会导航到该新页面。

我检查了Programmatically navigate using react router V4Programmatically navigate using react router,但仍然没有到达任何地方。请帮忙。

0 投票
1 回答
1173 浏览

reactjs - 为什么 mobx-react 观察者会破坏 react-router-dom navlink 活动类?

当使用mobx-react' s组件上的活动类observer的应用程序被破坏。react-routerNavLink

产生问题的设置:

使用创建反应应用程序

包.json

应用程序.js

导航.js

这是问题的简化显示。我的用例涉及实际使用 amobx store创建NavLink's 并使用装饰器。寻找观察者包装器停止应用活动类的原因。react-router-dom

0 投票
3 回答
5089 浏览

reactjs - react-router-dom TypeScript TS2322:类型'typeof Index'不可分配给类型

我使用 react-router-dom 在我的主要 React 组件中遇到了很多相同的 TypeScritp 错误。所有子组件都返回错误:

我的 Main.tsx 组件看起来像这样(所有其他 components.tsx 似乎编译没有问题):

谁能提供一些线索?

0 投票
1 回答
3478 浏览

javascript - 以编程方式反应路由器 v4 导航

当我使用 Redirect、Link 或 NavLink 的反应路由器时,一切都很好。但我需要一个以编程方式将我导航到路线的功能。

这就是我想要的:

如您所见,反应路由器 v4 中不再存在上下文历史记录。我无法在 js 代码中编写 withroute 进行导航。谁能告诉我如何直接在 js 代码中导航?

谢谢