- 追加された行はこの色です。
- 削除された行はこの色です。
#author("2023-02-27T13:20:46+09:00","default:ryuichi","ryuichi")
* useEffectとtry-catchの例外処理 [#sbacfd64]
** try-catchの中でuseEffectを使う [#j84da585]
const App = () => {
try {
useEffect(() => {
throw new Error('My Error');
});
} catch (e) {
console.log('DEBUG: ' + e.message);
}
return <div>My App</div>;
};
- 上の例ではcatchの中は実行されない
- なぜなら、useEffectの中の処理はコンポーネントがレンダーされた後に実行されるから
- つまり、Appコンポーネントがマウント（レンダー）されると、tryの中のuseEffectは実行されるが中の処理が実行されることなく（例外がthrowされることなく）、returnの行まで処理が進み、My Appがレンダーされる
- レンダーされた後に、useEffectの中が実行されて例外がthrowされるが、この例外はcatchされない
