---

title: ローディング category: Router order: 6

import Link from "../../../../components/Link.jsx";

ローディング

ローディングコンポーネントは、ページの取得中にローディング状態をレンダリングするために使用されます。

<Link name="implementation"> ## 実装 </Link>

通常のルートファイルと同じルールを使用して、任意のパスのルート定義ファイルを作成し、名前をloading.jsxにしてカスタムの読み込みコンポーネントを定義できます。このファイルは、ページの取得中にローディングコンポーネントをレンダリングするために使用されます。

// (root).loading.jsx

export default function Loading() {
  return <div>Loading...</div>;
}

レイアウトの横に読み込みコンポーネントまたはフォールバックエラーコンポーネントを追加すると、ルーターは自動的にレンダリングするページの部分的な事前レンダリングを有効にします。部分的な事前レンダリングを無効にするには、react-server.config.mjsにprerender: falseを追加します。詳細については、部分的な事前レンダリングを参照してください。

警告: エラーバウンダリ、エラーフォールバック、またはローディングコンポーネントは、ページではなくレイアウトに対してのみ定義できます。