numb_86 https://blog.hatena.ne.jp/numb_86/ 30歳からのプログラミング https://numb86-tech.hatenablog.com/ React Error Boundary は React のv16から導入された機能で、これを使うとコンポーネント内で発生したエラーをキャッチすることが出来る。 主に、エラー用のUIを表示したり、エラーを記録したりすることに使われる。 前者にはstatic getDerivedStateFromErrorというメソッドを、後者にはcomponentDidCatchというメソッドを用いる。 Error Boundary のためのクラスコンポーネントを作り、そこにこれらのメソッドを定義して使う。 この記事では、バージョン16.8.6で動作確認している。 動作確認用のアプリの用意 以下の内容でアプリを作る。 <… 190 <iframe src="https://hatenablog-parts.com/embed?url=https%3A%2F%2Fnumb86-tech.hatenablog.com%2Fentry%2F2019%2F06%2F15%2F223401" title="Error Boundary で React アプリ内のエラーを捕捉する - 30歳からのプログラミング" class="embed-card embed-blogcard" scrolling="no" frameborder="0" style="display: block; width: 100%; height: 190px; max-width: 500px; margin: 10px 0px;"></iframe> https://cdn-ak.f.st-hatena.com/images/fotolife/n/numb_86/20190615/20190615221816.png Hatena Blog https://hatena.blog 2019-06-15 22:34:01 rich https://numb86-tech.hatenablog.com/entry/2019/06/15/223401 1.0 100%