问题标签 [react-router]

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 回答
1198 浏览

javascript - 反应路由器错误 - '无法调用未定义的方法'getRouteAtDepth''

我正在尝试在我的应用程序上实现 react-router。我的主文件包含以下代码:

在我的App组件中,我有以下代码:

此代码生成以下错误:

如果我改为<RouteHandler />直接<ContentPage />,则代码有效。知道我在做什么错吗?

编辑:显然,我使用的是“ React starter kit ”,它也在服务器上呈现“App”组件。将 react-router 添加到该组件时,会产生此(服务器端)错误。

我的项目不需要服务器端渲染,因此删除它解决了我的问题。当我有时间时,我会尝试调查为什么会发生这种情况。

0 投票
2 回答
2376 浏览

javascript - 我如何使用服务器上的反应路由器处理所有可能的路由?

按照react-router 中的自述文件

对节点和信誉良好的前端 js 框架非常新鲜,请原谅这个菜鸟问题..

如何最好地处理服务器上的路由?

我的意思是,当有人登陆时会发生什么/calendar,我是否必须在反应代码中适应客户端的路由和在快速路由中的服务器,或者是否应该在 express 上有通配符路由。IE 有人登陆/calendar,应该表达交付的 html/并让 react 来处理其余的?

谢谢,约翰

0 投票
3 回答
11974 浏览

reactjs - 反应路由器错误:超级表达式必须为空或函数

我是 react-router 新手(https://github.com/rackt/react-router)。我在做出这样的反应后将其包括在内:

我收到一个错误:Uncaught TypeError: Super expression must be null or a function, not undefined

我做错什么了?

0 投票
1 回答
765 浏览

javascript - react-router Router.HistoryLocation 离开目标

I have just left the starting blocks with ReactJs and discovered the react-router. Awesome stuff but i cannot see to get the following code to work with the "Router.HistoryLocation" as the 2nd param to the run function.

It all works perfectly without however uses a # in the url. This Q got me to Router.HistoryLocation as the 2nd param, so do the github docs. But when ever i run this in the browser the result is the target filled with nothing more that this:

#xA;

Here is the code running on jsbin: http://jsbin.com/saxutulaxi/1/. If you edit the code and remove the "Router.HistoryLocation" from the last bit it all works but with it does not.

Here is the simple script i am running. // This is straight from the overview.md in the react-router docs var Router = ReactRouter; var DefaultRoute = Router.DefaultRoute; var Link = Router.Link; var Route = Router.Route; var RouteHandler = Router.RouteHandler;

#xA;

Not sure what else to do except ask on here as i think i have followed the guides to the letter...

Thanks, John

0 投票
2 回答
28547 浏览

google-analytics - React + 路由器 + 谷歌标签管理器

我花了一些时间在 quickcypher.com 上开发 MVP。我想开始进行一些分析,它仅用于跟踪总访问量非常有效,但是当我尝试在使用 React Router 的网站上跟踪不同的 URL 时,事情就变得糟糕了。

我的方法是:设置一个在某些页面上触发的 GA 标记,使用自定义“pageview”事件的触发器。例如,当事情发生时,我会将字段页面设置为“/rap”。我在每个视图的顶级组件的“componentDidMount”方法中触发了该事件。使用调试器,我看到事件按预期触发,但在我的一生中,我无法让 GA 确认事件。当我简化标签以在“所有页面”上触发时,GA 按预期工作,所以我假设它与 React 有关。

有没有人成功实现过这个或遇到过类似的问题?我的方法全错了吗?希望得到一些指导......干杯!

0 投票
0 回答
154 浏览

javascript - 允许服务器端 ReactJS 应用程序响应客户端

我已经成功地让 ReactJS 在服务器端工作,但是我很难集中精力让我的客户端做出响应。

就像我需要打开所有东西一样。我不是通过 ajax 或任何东西来获取数据,任何数据都在组件本身的 JSON 中。

我看到很多文字建议,但没有关于如何让它工作的确切代码。另外,我正在使用反应路由器。


附加背景,我正在使用 commonJS 和 grunt 来编译它。我将编译后的 JS 包含在我的 html 文件中。当我单击按钮等时,什么也没有发生。

服务器:

路由器:

0 投票
2 回答
2207 浏览

react-router - react-router的开玩笑测试

我正在尝试为 react-router Route 模块编写一个简单的笑话测试。

该组件有一个按钮,当单击它时,通过使用“transitionTo”方法可以编程导航到另一条路线。

即使在添加了 stubRouterContext 实用程序(如此所述)并将我的 UserDetails 组件包装在 stubRouterContext 中之后,我仍然不断收到以下错误:

TypeError: Property 'transitionTo' of object #<Object> is not a function

我正在使用 react 12.2、react-router 12.4 和 jest 2.2

我的虚拟组件:

我的测试文件:

我的 stub-router-context.cjsx 文件:

0 投票
1 回答
2005 浏览

node.js - 使用 Superagent 服务器端连接 ECONNREFUSED 错误

我正在构建一个同构的 React 应用程序。我正在使用 Webpack 来捆绑我的 JS。我正在使用 react-router 进行路由。当我点击“/search”路由时,要渲染的组件调用 API(当前只是一个测试 JSON 文件)。在客户端,超级代理调用工作正常,并在渲染此路由时提取数据。当我尝试从到达服务器端呈现相同的路由时,我收到此错误:

任何想法为什么会发生这种情况?

这是进行调用的代码:

0 投票
14 回答
180380 浏览

javascript - 如何在 React Router 中将 DefaultRoute 设置为另一个路由

我有以下内容:

使用 DefaultRoute 时,SearchDashboard 呈现不正确,因为任何 *Dashboard 都需要在 Dashboard 中呈现。

我希望“app”路由中的 DefaultRoute 指向路由“searchDashboard”。这是我可以用 React Router 做的事情,还是我应该为此使用普通的 Javascript(用于页面重定向)?

基本上,如果用户转到主页,我想将它们发送到搜索仪表板。所以我想我正在寻找一个等效于的 React Router 功能window.location.replace("mygreathostname.com/#/dashboards/searchDashboard");

0 投票
3 回答
3140 浏览

reactjs - 恢复后退按钮上的滚动位置

我有一个路由处理程序,它从商店请求数据,然后映射该数据以呈现组件列表。我的问题是,当我导航到另一个页面然后返回时,滚动位置不会恢复,因为必须重新渲染组件。是否有延迟设置滚动位置直到列表呈现,或者在任何类型的导航上保留和恢​​复呈现组件的状态?