+page@routeでレイアウトから抜ける
@セグメント記法を使用して、特定のページのレイアウトチェーンをリセットします。
「+page@routeでレイアウトから抜ける」はCoddyKit上の無料Sveltejs Academyレッスンです。 これはレッスン3/4です。 下記で完全なレッスンを無料で読むことができます。その後、ブラウザ内の組み込みコードエディタと24時間対応のAIチューターでハンズオン演習できます。 これはSveltejs Academy学習パスの一部であり、ウェブとCoddyKitアプリ全体で進捗が同期されます。 Sveltejs Academyコースには全4レッスンが含まれています。
レイアウトリセット構文
ファイル名に@構文を使うと、名前を指定した祖先までのレイアウトから抜け出せます。
例: ルートにリセット
ファイル名を+page@.svelteにすると、すべてのレイアウトから抜け出せます。
src/routes/admin/login/+page@.svelte // skips admin layout名前付きレイアウトにリセット
@の後に親の名前を指定すると、そのレベルまでリセットできます。
+page@(marketing).svelte // resets to the (marketing) layoutリセットする理由
ログインページ、フルスクリーンの体験、埋め込みコンテンツでは、グローバルな共通UIを省略する必要があることがよくあります。
URLは変わらない
リセットで変わるのはレイアウトチェーンだけで、URLはそのままです。
レイアウトにも適用可能
レイアウト自身も@構文を使ってリセットできます。
よくあるパターン
マーケティングサイトには共通UIレイアウトがありますが、サインアップページでは共通UIを表示しないようにします。
グループとの組み合わせ
@構文はレイアウトグループと組み合わせて使うことで、レイアウトを完全に制御できます。
エラーページ
エラーページも必要に応じて継承したUIなしでレンダリングされるよう、レイアウトから抜け出せます。
ドキュメント化のヒント
@を使う場合はコード内にコメントを残してください。この規則は見落としやすいためです。
リファクタリング
ルートを独自のレイアウトグループに移動する前に、@によるリセットを追加します。
簡単な確認
すべてのレイアウトから抜け出すにはどうしますか？
まとめ
ファイル名で@構文を使うと、ルートまたは特定の名前付き祖先までのレイアウトから抜け出せます。
よくある質問
「+page@routeでレイアウトから抜ける」レッスンは無料ですか？
はい。「+page@routeでレイアウトから抜ける」の完全なテキストはこのウェブで無料で読めます。インタラクティブに演習し（組み込みコードエディタと24時間対応のAIチューター）、Sveltejs Academyコースの残りをアンロックするには、CoddyKit PROにアップグレードしてください。 Sveltejs Academyコースには全4レッスンが含まれています。
「+page@routeでレイアウトから抜ける」で何を学びますか？
@セグメント記法を使用して、特定のページのレイアウトチェーンをリセットします。 ブラウザで直接実行するハンズオンコードでSveltejs Academyを演習し、24時間対応のAIチューターがレッスンを進める中での質問に答えます。
Sveltejs Academyを始めるのに経験は必要ですか？
事前経験は必要ありません。CoddyKitのSveltejs Academyは初級者から上級者向けに構成されているため、ここから始めるか最初から始めて、自分のペースで進むことができます。 これはレッスン3/4です。
「+page@routeでレイアウトから抜ける」レッスンにはどのくらい時間がかかりますか？
ほとんどのCoddyKitレッスンは約5～10分かかります。各レッスンはコンパクトでインタラクティブなので、着実に進歩し、ウェブとアプリ全体で正確に前回の場所から再開できます。
このSveltejs Academyレッスンでコードを書いて実行できますか？
はい。すべてのSveltejs Academyレッスンに組み込みコードエディタが含まれているため、ブラウザでリアルコードを書いて実行し、即座のAIフィードバックを取得できます。ローカル設定は不要です。
このコースのすべてのレッスン
- (group)によるレイアウトグループ
- ルート単位のレイアウト
- +page@routeでレイアウトから抜ける
- レイアウト間で共有するデータ