React Developer Tools で Suspense の状態を操作する
2025-11-20
a month ago
開発環境
- next 15.5.6
- react 19.2.0
- react-dom 19.2.0
前提
Server Components で Suspense を利用することを前提としています。
本題
開発時にローディング状態の見た目を確認したいときありますよね？
React Dev Tools を使うと Suspense 状態を自由に、簡単に切り替えることができます。
以下手順です。
- Dev Tools (F12)を開く
- Componentsを選択
- Suspense の状態を切り替えたいコンポーネントを選択
- 右上の時計マークをクリック
さいごに
該当のコンポーネントをツリーペインから探すのが大変な時もありますが、検索もできるので、こちらも活用してみてください。
