在这篇关于Meteor 和 React的教程中，作者使用 react-router v2-3，我想使用新的 React-router v4 来完成。所以我尝试更改使用 react-router v2 的代码：

对此，使用 v4：

但浏览器 console.logs 我一个错误：

How in the world does one use nested routes in react-router, specifically, version 4.x? The following worked well in previous versions...

Upgrading to 4.x throws the following warning...

Warning: You should not use <Route> component and <Route children> in the same route; <Route children> will be ignored

What in the heck is going on here? I've scoured the docs for hours and can not successfully get nested routes working. How does one use <Route>components to nest their routes in react-router v4? How does my simplistic example translate to v4.x API compliance to nest a route?

我正在尝试使用 react-router 4.0.0 设置一个通用的反应应用程序。

除了我的链接标签在服务器和客户端上的呈现方式不同之外，服务器端呈现工作正常。这是错误消息：

警告：React 尝试在容器中重用标记，但校验和无效。这通常意味着您正在使用服务器渲染，并且在服务器上生成的标记不是客户端所期望的。React 注入了新的标记来补偿哪些工作，但是您已经失去了服务器渲染的许多好处。相反，找出为什么生成的标记在客户端或服务器上是不同的：

我对 react-router 和一般反应非常陌生，所以请记住，这可能是我的代码中的一个微不足道的错误。另外，我正在学习，所以，我的代码中可能还有其他吵闹的错误，提前抱歉。

在网上看，我想出了这个涵盖类似问题的错误修复：https ://github.com/ReactTraining/react-router/pull/4484

然而，这个补丁包含在 react-router 4.0.0 中（我戳了一下代码，它确实是固定的）。因此，我的问题不能由此引起。

经过大量修补后，我怀疑我的配置或由于我对自己正在做的事情的有限理解而引起的错误。例如，对于 StaticRouter，我使用location={req.originalUrl}而不是location={req.url}像req.url往常一样使用/，我不知道为什么。

我在下面发布了我认为相关的文件，但如果你想查看完整的代码，你可以在这里找到它：https ://github.com/magp/furb/tree/universal

包.json

应用程序/serverlauncher.js

应用程序/server.jsx

应用程序/路由/Routes.jsx

应用程序/组件/Layout.jsx

请原谅这个冗长的问题，并提前感谢您提供的任何帮助。

我有一条在检查这样的条件后重定向的路线

当条件为真但组件未挂载时，url 会发生变化。其余的组件代码如下。

我的应用程序组件包含在 BrowserRouter 中，就像这样

当我直接在浏览器中点击 url 时，像 'localhost:3000/intro' 组件已成功安装，但是当它通过重定向时，它不会显示该组件。我如何解决它？

编辑

所以缺少一个细节，我尝试创建另一个项目来重现该问题。我的 App 组件是来自 mobx-react 的观察者，它的导出如下所示

我已经使用示例代码创建了这个 repo 来重现您可以使用它的问题 https://github.com/mdanishs/mobxtest/

因此，当组件被包装到 mobx-react 观察者中时，重定向不起作用，否则它可以正常工作

我想在成功登录后重定向到新页面。路线（V4）的使用方式如下：

传奇看起来像：

我的主要问题是如何分享browserHistory。 createHistoryfrom historymodule 不是一个signleton，所以我不得不添加：

history向 saga提供实例的最有效方法是什么？

我需要在 的Link组件中传递一些数据react router v4，但我找不到办法。

基本上，我有一些动态生成的链接。我已通过以下方式将这些链接与Link组件链接起来。单击其中一个链接后，用户将被路由到一个新组件。我想将一些数据传递到这些新组件中，以便我可以在那里显示它们。

中是否有某种<Link to="path" data="data here">some text</Link>方法react router v4？我似乎无法在文档页面中找到它。

这是我的 v3react-router代码。这是一个嵌套路由。

升级到 v4 后，不再渲染任何内容。为什么？

到目前为止，我已经阅读了很多关于 react-router v4 和 npm 历史库的内容，但似乎没有一个对我有帮助。

当使用 history.push() 方法更改 url 时，我的代码按预期运行，直到它应该导航并执行简单的重定向。URL 正在更改为指定的路由，但未在按钮推送时进行重定向。先谢谢了，还在学习react-router...

我希望按钮按下可以在没有 {forceRefresh:true} 的情况下进行简单的重定向，然后重新加载整个页面。

这是我的目标。我想创建一个复合组件，它将在显示children元素之前检查匹配 url 的有效性。否则，它会返回一个通用组件以显示错误消息。

所以这是我的“装饰器”代码：

这是它在我的路由器中的使用方式：

我现在遇到的问题是我仍然想将match对象传递到childreninside EnforceUrlValidation。我怎样才能做到这一点？

尝试 1：

在这种children情况下不呈现。

尝试 2：

失败是因为div不支持match

不太熟悉反应路由器，但我需要 NavLink 的功能来在父li元素上设置活动类，而不是a元素。

为了实现这一点，我只是查看了源代码NavLink并将其复制到一个新元素中。（使用 typescript 的示例，但与 js 几乎相同）

然后是用法：

我正在使用一个HashRouter并且由于某种我无法弄清楚的原因，当路线改变时它不会更新，只有当我硬“刷新”页面时它才会更新它应该如何更新。

我相信它永远不会更新，因为道具永远不会改变？所以它不知道更新自己？

我怎样才能得到这个更新？还是我的问题在其他地方？