问题标签 [reach-router]

我正在用 Jest 和 Enzyme 编写单元测试。我在 404 页面上有一个按钮，应该将用户重定向到网站主页。我想编写一个测试以确保此按钮将用户重定向到主页，而不管 URL 是什么。换句话说，如果按钮单击将用户带到主页，则测试应该通过并且不应该依赖于 href。

到目前为止，我有代码可以单击我的按钮，该按钮应该重新路由用户。

单击按钮时，我们应该被路由到，<HomePage />所以我尝试添加：

似乎我需要<HomePage />与单击按钮的结果进行比较，但我还没有找到可行的解决方案。

我有这种情况。

• 用户在/company/<company-id>地址栏中输入。
• 由于应用程序与后端完全分离，因此它需要预取公司。
• 正常的用户流是/login-> /company/。我很好地处理了这个案例，/company/<whatever id is first in the prefetch>并且没有问题地导航到。
• 但是如果你用 id加载呢？我有解决方案，但我觉得我在路由中误解了一些东西。

companyState.success您可能会假设我的预取有效，并且下面的代码片段只有在为真时才会触发。就像我说的，它正在工作。我手动处理了这个，通过

我有钩子，如果company.set(<company:id>)确实更新，它将预先获取视图所需的所有其他内容。而且，company是一个自定义上下文挂钩，因此它在我的应用程序中无处不在。

有没有更好的方法来处理这个问题？手动检查路径名似乎是 hack-y。您可以假设 mygatsby_node.js具有正确的定义以允许客户端路由。

这是我的路由定义：（这是我放在 pages 文件夹中的内容）

最后在组件文件夹中，

我对到达路由器有一点问题，使用反应钩子。我需要在浏览器中捕获路由的参数，我尝试使用到达路由器网络中的本机文档的道具，但这并没有给我参数，路由是这样的： http://localhost:8080/home?init=true

如何捕获该变量“init”？

我在 React 应用程序中使用Reach 路由器（带有打字稿）。

使用嵌套路由我陷入了如何将嵌套组件呈现为单独的（在单独的视图中）组件而不是作为父组件底部的子组件的问题。

代码如下：

我使用 PDFExport 作为嵌套的原因是我想将它重用于不同的路线，例如；/users/:id, /customers/:id.

有没有办法将嵌套路由呈现为单独的组件而不是子组件。

我正在使用@reach/routerReact。我创建了一个带有所需道具的路由组件。当应用程序安装但路线未激活时，我会收到道具类型警告。

这个简单的例子改编自@reach/router docs。

代码呈现Home组件而不是User组件。尽管如此，我可以在控制台中看到以下错误：

除非渲染组件，否则我不希望看到此错误。

有没有办法防止这种情况发生？

我想使用 指定动态段中的道具是必需的prop-types，但我不想看到这个道具警告。

为了简短起见，我试图在路由器内部渲染一些包裹在 ErrorBoundaries 中的路由，但它与提供的路径不正确匹配。

这是我设置的一个快速沙盒示例，以显示我在说什么。如果您查看沙盒并单击链接，您会test看到即使.ComponentWithoutErrorspath/test

任何帮助将不胜感激。

https://codesandbox.io/s/still-fire-bfehr?fontsize=14&hidenavigation=1&theme=dark

我使用了 react-router-dom 5.1.2，现在我想切换到https://www.npmjs.com/package/@reach/router Reach 路由器（1.2.1）。

我将它添加到依赖项中并做到了：

现在我收到以下错误：

我的 polyfill.js 看起来像这样：

有人可以帮忙吗？

通过到达路由器 https://testing-library.com/docs/example-reach-router使用反应测试库

函数的第二个参数，怀疑是一个对象，{}。但是使用 '=' 而不是 ':' 意味着它不是名称-值对。那是什么？

另外，两个对象之间的赋值运算符的目的是什么

使用到达路由器的应用程序。有两个页面，apage 和 bpage 渲染 APage 和 BPage
Apage 有一个标题和按钮。单击按钮时，应用程序导航到 bpage。

应用程序.js

使用 @testing-library/react 使用标题的文本内容测试从 apage 到 bpage 的导航。

基于https://testing-library.com/docs/example-reach-router

renderwithRouter.js

我的导航测试

应用程序.test.js

未能给予

我如何测试这个导航？

我想有选择地将一些道具传递给每个子元素并设置它们的样式。

我注意到我不能简单地遍历并将道具传递给每个孩子

使用渲染函数在内部不起作用<router>。它打破了嵌套路由，如果孩子的数量不确定，我不喜欢为每个孩子手动输入道具。

接下来，我继续尝试使用 css-in-js 解决方案（情感）来选择和设置每个直接后代的样式，<Burger/>但这在这种情况下似乎也不起作用。

最后，我发现将 children.map 与 React.cloneElement 结合使用的解决方案并不令人满意，因为如果每个孩子太大或太嵌套，应该会有一些性能影响。

还有另一种方法来实现我想要的吗？谢谢你。