Question

我正在使用React开发SPA。

当前，在生产环境中，用户仅会在应用崩溃时看到空白页。

因此，我正在尝试设置自定义错误页面。

由于我在自己的React应用中使用BugSnag进行错误监控；我已经使用了BugSnag提供的ErrorBoundary。

以下是用于初始化和放置ErrorBoundary的代码。

<h1 style="text-align: center; font-size: 24px">Header</h1>
<table>
  <tr>
    <td class="line">%SM02_01a% I had heard about her sister ship. It was called the “Titanic” and she had </td>
  </tr>
  <tr>
    <td class="line">%SM02_02a% sunken last year. That was it what let me feel fear, although they also promised that this ship </td>
  </tr>
  <tr>
    <td class="line">%SM02_03a% the “Olympic”, was even safer than her sunken predecessor</td>
  </tr>
</table>

以下是自定义错误代码：

const bugsnagClient = bugsnag('8XXXXXXXXXXXXXXXbac')
bugsnagClient.use(bugsnagReact, React)
const ErrorBoundary = bugsnagClient.getPlugin('react')

ReactDOM.render(
<ErrorBoundary FallbackComponent={FallBack}>
    <IntlProvider locale={language} messages={messages[language]}>
        <Provider store={store}>
            <App />
        </Provider>
    </IntlProvider>
</ErrorBoundary>,
document.getElementById('root')
);

以某种方式，它仍然显示空白页。

React组件树之外可能会发生错误，因此ErrorBoundry不会捕获该错误。

关于如何解决此问题的任何想法？

Answer 1

如果错误发生在React组件树之外，则ErrorBoundary不会捕获该错误，并且不会呈现Fallback组件。

如果您有一个复制案例触发了无法正常工作的React组件树中的错误，请通过Bugsnag支持与我们联系，我们将进行调查。

谢谢！

BugSnag ErrorBoundary在反应中未显示自定义错误页面

1 个答案: