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

← 古い編集新しい編集 →

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

@@ 142行目: / 142行目: @@
 ==== NavigationManagerを使用したプログラムによる遷移 ====
   <syntaxhighlight lang="c#">
-  @inject NavigationManager NavigationManager
+  @inject NavigationManager Navigation
   @code {
-     private void NavigateToCounter()
+     private void Navigate()
      {
-        NavigationManager.NavigateTo("counter");
+        // 基本的な遷移
+       Navigation.NavigateTo("counter");
+       // 強制的なページリロード
+       Navigation.NavigateTo("counter", forceLoad: true);
+       // 相対パスでの遷移
+       Navigation.NavigateTo("counter", forceLoad: false);
+       // クエリパラメータを含む遷移
+       Navigation.NavigateTo($"search?query={Uri.EscapeDataString(searchTerm)}");
+       // 戻る
+       Navigation.NavigateTo(Navigation.Uri);
+    }
+    // URLの変更を検知
+    protected override void OnInitialized()
+    {
+       Navigation.LocationChanged += LocationChanged;
+    }
+    private void LocationChanged(object sender, LocationChangedEventArgs e)
+    {
+       // URLが変更された時の処理
      }
   }
   </syntaxhighlight>
 <br>
-==== リンクによる遷移 ====
+==== NavLinkコンポーネントを使用したリンクによる遷移 ====
 NavLinkコンポーネントを使用して遷移する。<br>
 <br>
   <syntaxhighlight lang="c#">
-  <NavLink href="counter">
+ // 基本的な使用方法
-    <span class="oi oi-plus"></span> Counter
+  <NavLink href="counter">Counter</NavLink>
-  </NavLink>
+ // アクティブ時のスタイル指定
+ <NavLink href="counter" ActiveClass="active">Counter</NavLink>
+ // Match属性による一致条件の指定
+ <NavLink href="users" Match="NavLinkMatch.Prefix">Users</NavLink>
   </syntaxhighlight>
 <br><br>