Blazorのルーティングとは？@pageの仕組みと画面遷移の基本｜ASP.NET×Blazor入門 5.0

第5章：ルーティングとナビゲーション

Webアプリにとって「画面を切り替える」機能は欠かせません。ユーザーがURLを指定してページを開いたり、画面内のリンクから遷移したり──。こうした操作を支えるのがルーティングとナビゲーションの仕組みです。

Blazorは、サーバーでもWASMでも、C#の世界で完結するルーティング機構を提供しています。本章では、以下の3つのセクションを通じて、URLとコンポーネントを結びつける方法と、ユーザー操作による画面遷移の制御を学んでいきましょう。

Blazorのルーティングの基盤となるのが、コンポーネントの先頭に書かれる @page ディレクティブ。これがどのようにURLと結びついて動作するのかを詳しく見ていきます。

ユーザーのIDや記事のスラッグなど、URLにパラメータを含めて情報を渡したい場面は多くあります。 Blazorでは、C#コードで型安全にパラメータを受け取れるのが特徴です。

画面遷移を行うためのリンクやボタンの作成方法、プログラムによる遷移制御など、実際のナビゲーション処理を整理します。

それでは次のセクションでは、ルーティングの第一歩となる「@pageディレクティブの意味」について詳しく見ていきましょう。

2025-04-20

開発に関するインプットをアウトプットしています。

システム開発や技術検証、要件定義の作成、アーキテクチャ設計、テスト設計、運用設計まで、一気通貫で支援しています。企画段階の「まず相談したい」レベルから、実装・運用まで幅広く対応できますので、お気軽にお問い合わせください。