「Blazor - ルーティング」の版間の差分

📢 Webサイト閉鎖と移転のお知らせ

このWebサイトは2026年9月に閉鎖いたします。

移転先はhttps://mochiu.net/index.php?title=Blazor - ルーティングです。

新しい記事は移転先で追加しております。（旧サイトでは記事を追加しておりません）

← 古い編集新しい編集 →

ビジュアルウィキテキスト

@@ 192行目: / 192行目: @@
 == オプションパラメータ / クエリパラメータ ==
+パラメータ処理により、以下に示すようなURLに対応することができる。<br>
+* /products
+*: カテゴリなし
+* /products/1
+*: カテゴリID指定
+* /products?search=keyboard
+*: 検索キーワード指定
+* /products/1?search=keyboard&page=2
+*: 全てのパラメータ指定
+<br>
 ==== オプションパラメータ ====
 波括弧内に<code>?</code>を付加することにより、実現できる。<br>
 <br>
   <syntaxhighlight lang="c#">
-  @page "/user/{id?}"
+  @page "/user/{id?}"                     // idパラメータはオプション (省略可能)
+ @page "/blog/{year:int?}/{month:int?}"  // 年月も省略可能
   @code {
      [Parameter]
      public string Id { get; set; }
+    [Parameter]
+    public int? Year { get; set; }
+    [Parameter]
+    public int? Month { get; set; }
      protected override void OnInitialized()
      {
-        if (string.IsNullOrEmpty(Id))
+        // パラメータが省略された場合のデフォルト値設定
+       Id    ??= "default";           // Idが未指定の場合は、"default"を設定
+       Year  ??= DateTime.Now.Year;   // 年が未指定の場合は現在の年を設定
+       Month ??= DateTime.Now.Month;  // 月が未指定の場合は現在の月を設定
+    }
+ }
+ </syntaxhighlight>
+<br>
+==== クエリパラメータ ====
+ <syntaxhighlight lang="c#">
+ @page "/search"
+ @inject NavigationManager NavigationManager  // URLの操作に必要なサービスの注入
+ @code {
+    // クエリパラメータを格納するディクショナリ
+    private Dictionary<string, string> QueryParameters;
+    protected override void OnInitialized()
+    {
+       // 現在のURLからクエリパラメータを解析
+       var uri = new Uri(NavigationManager.Uri);
+       QueryParameters = Microsoft.AspNetCore.WebUtilities.QueryHelpers.ParseQuery(uri.Query)
+                         .ToDictionary(p => p.Key, p => p.Value.ToString());
+    }
+    // 検索条件を更新してページ遷移を行うメソッド
+    private void UpdateSearch(string query, int page)
+    {
+       // クエリパラメータの設定
+       var parameters = new Dictionary<string, string>
         {
-           Id = "default";
+           { "q", query },              // 検索キーワード
-        }
+          { "page", page.ToString() }  // ページ番号
+       };
+       // クエリパラメータを含むURLを生成して遷移
+       var url = QueryHelpers.AddQueryString("/search", parameters);
+        NavigationManager.NavigateTo(url);
+    }
+ }
+ </syntaxhighlight>
+<br>
+==== 2つのパラメータの組み合わせ ====
+ <syntaxhighlight lang="c#">
+ @page "/products/{categoryId?}"              // カテゴリIDはオプション
+ @inject NavigationManager NavigationManager
+ @code {
+    [Parameter]
+    public string CategoryId { get; set; }  // URLパラメータ
+    // クエリパラメータから検索キーワードを取得
+    private string SearchTerm => GetQueryParameter("search");
+    // クエリパラメータからページ番号を取得 (デフォルト : 1)
+    private int Page => int.Parse(GetQueryParameter("page") ?? "1");
+    // クエリパラメータを取得するヘルパーメソッド
+    private string GetQueryParameter(string key)
+    {
+       var uri = new Uri(NavigationManager.Uri);
+       var parameters = QueryHelpers.ParseQuery(uri.Query);
+       return parameters.TryGetValue(key, out var value) ? value.ToString() : null;
      }
   }