问题标签 [react-error-boundary]

我的用例是：在我的反应应用程序的顶层，我想捕获任何错误，清除缓存（以防止任何与数据相关的错误持续存在），然后无论如何都会抛出错误，以便应用程序崩溃。

这可能并不像听起来那么奇怪，因为我在 React Native 中工作。在移动应用程序中，错误导致应用程序崩溃是很常见的，因此您可以再次打开它。

我已经建立了这个：

然而，再次抛出错误似乎没有任何作用 - 看起来它只是挂在null状态上。

有没有办法实现这一目标？

我在 React/ErrorBoundary 组件上遇到类型问题，指出'typeof ErrorBoundary' 类型的参数不可分配给 'ComponentType< never >'类型的参数。

澄清一下：我使用 mapStateToProps 将其与商店中设置的用户语言首选项联系起来。

这是我的组件

作为参考，这些是我导入的 ErrorText 类型：

因此，在母组件上，我遇到了一个错误。这个 JSX 标签的 'children' 属性需要一个类型为 ' never ' 的子级，但提供了多个子级。

关于如何解决这个问题的任何想法？：/

我的应用程序从 中获取API，然后呈现数据。如果输入了不存在的值，则error boundary触发并捕获错误。

我正在ErrorBoundary从react-error-boundary图书馆和图书馆QueryErrorResetBoundary使用react-query。

使用我的React-Error-Boundary设置，我的应用程序在发生error boundary事件时有一个触发器，error并且能够error通过重置从state. 我目前对发生事件error boundary时的触发进行了通过测试error。现在我想测试是否error boundary可以从 triggererror boundary和 reset中恢复state。请让我知道如何使用Jestand来解决这个问题React Testing Library。

应用组件

应用程序.test.js

从错误边界的反应文档中：

React 16 将渲染过程中发生的所有错误打印到开发中的控制台，即使应用程序不小心吞下了它们。

由于上述原因，我在运行测试时收到了大量不必要的控制台错误。是否可以在 Jest 中隐藏这些，而无需在 console.error 上进行模拟/监视？

我不太确定，如果我完全理解 React 的概念ErrorBoundary。我需要说，我实际上想开始使用 ErrorBoundary，但我是第一次使用它。

所以我创建了一个ErrorBoundary组件：

现在我尝试在我的app.container.js（我不会复制它的整个代码，只是它的必要部分）中使用它：

然后我开始手动创建错误。我在我的变量中添加了一个navbar.component.js不存在的变量并导致抛出错误。

到目前为止效果很好。错误正在发送到后端并显示我的后备 UI 组件。到目前为止，一切都很好。

但是，现在我不想在顶层捕获错误，而是在单个组件中捕获错误，以便应用程序仍然可用，并且仅在发生错误时在单个组件中显示错误消息。因此，我现在已将ErrorBoundary组件移至navbar.component.js（并从中删除app.container.js）。

...期望相同的结果，但仅在显示导航栏的位置显示我的后备 UI 组件。但实际上结果是，ErrorBoundary移动到导航栏时根本没有触发。为什么？是不是不能ErrorBoundary给每个组件本身加上组件，这样就只显示出错的组件而不显示整个app？非常感谢您提前对此做出任何解释！

PS：我也想知道，为什么我不能在我的组件中同时使用getDerivedStateFromErrorandcomponentDidCatch方法。ErrorBoundary在 中定义getDerivedStateFromError方法时ErrorBoundary，该方法componentDidCatch从未被调用：

...但据我所知，仅使用 componentDidCatch.

我在我的代码中使用错误边界，当我在渲染主要布局组件的文件中使用它时，它可以工作，例如：

上面的代码有效，并且针对组件中的错误显示了回退 UI main。但是当我在主组件文件中使用错误边界组件时它不起作用，例如错误边界不起作用：

这不起作用，整个应用程序崩溃，只显示一个空白页面。为什么会发生这种情况以及如何处理？谢谢你。

我试图在错误发生时捕获更多细节。

当错误发生时，我使用节点 api 服务器捕获错误并保存在日志文件中。

我模拟了一个网络错误并尽可能多地获取详细信息。

当我 console.log 前端的错误时，我得到了这个：

但我无法使用我的 api 发送此信息。我进入服务器端的所有内容都是一个空对象。

那么我怎样才能捕获并发送尽可能多的关于错误的详细信息并将其写入日志文件呢？

这是我的 ErrorBoundry 组件：

这是服务器端句柄：

我的错误边界使用 i18next 中的 useTranslation 钩子捕获了错误。由于该错误边界，我无法获得正确的错误文本。刚刚收到“以上错误发生在...”之类的文字。你能告诉我为什么会这样吗？

这条线的问题：

i18 配置：

我在错误边界中使用了 useTranslation，但是，删除它不是解决方案。

我正在尝试使用 ErrorBoundary 来捕获我的应用程序中的潜在错误。我能够看到该ErrorBoundary组件一秒钟，然后我的应用程序崩溃了。

它似乎发生在原始组件第二次引发错误时。

这是我的组件：

和我的错误边界

知道我做错了什么。顺便说一句，我正在使用反应 17.0.1

我在应用程序的根目录有一个带有错误边界的 React 应用程序。

我的问题是<CustomErrorBoundary>针对整个应用程序，因此任何后代都会抛出错误，但根应用程序会捕获，并且整个 UI 都会出现错误。

一种解决方案是为单个组件添加错误边界：

但这会导致代码不干净。我想要使​​用第一个片段但只为该子组件呈现错误 UI 的东西。另外，我希望保持 redux 状态。