コードでエラー境界を使用していますが、メイン レイアウト コンポーネントをレンダリングしているファイルでそれを使用すると、次のように機能します。
<ErrorBoundary>
<header></header>
</ErrorBoundary>
<ErrorBoundary>
<main/> //this component has an error
</ErrorBoundary>
<ErrorBoundary>
<footer></footer>
</ErrorBoundary>
上記のコードは機能し、main
コンポーネント内のエラーに対してフォールバック UI が表示されます。しかし、メイン コンポーネント ファイル内で errorboundary コンポーネントを使用すると、動作しません。たとえば、動作しない errorboundary の場合:
class main extends React.Component {
//code
<ErrorBoundary>
{object}
</ErrorBoundary>
//more code
これは機能せず、代わりにアプリ全体がクラッシュし、空白のページのみが表示されます。なぜこれが起こっているのでしょうか、またどのように対処すればよいのでしょうか? ありがとうございました。