Blazor URI and navigation state helpers (#12419)
parent
283060ec01
commit
b91564b05f
|
@ -5,7 +5,7 @@ description: Learn how to route requests in apps and about the NavLink component
|
|||
monikerRange: '>= aspnetcore-3.0'
|
||||
ms.author: riande
|
||||
ms.custom: mvc
|
||||
ms.date: 05/13/2019
|
||||
ms.date: 05/14/2019
|
||||
uid: blazor/routing
|
||||
---
|
||||
# Blazor routing
|
||||
|
@ -102,3 +102,37 @@ There are two `NavLinkMatch` options:
|
|||
* `NavLinkMatch.Prefix` – Specifies that the NavLink should be active when it matches any prefix of the current URL.
|
||||
|
||||
In the preceding example, the Home NavLink (`href=""`) matches all URLs and always receives the `active` CSS class. The second NavLink only receives the `active` class when the user visits the Blazor Route component (`href="BlazorRoute"`).
|
||||
|
||||
## URI and navigation state helpers
|
||||
|
||||
Use `Microsoft.AspNetCore.Components.IUriHelper` to work with URIs and navigation in C# code. `IUriHelper` provides the event and methods shown in the following table.
|
||||
|
||||
| Member | Description |
|
||||
| ------ | ----------- |
|
||||
| `GetAbsoluteUri` | Gets the current absolute URI. |
|
||||
| `GetBaseUri` | Gets the base URI (with a trailing slash) that can be prepended to relative URI paths to produce an absolute URI. Typically, `GetBaseUri` corresponds to the `href` attribute on the document's `<base>` element in *wwwroot/index.html* (Blazor client-side) or *Pages/\_Host.cshtml* (Blazor server-side). |
|
||||
| `NavigateTo` | Navigates to the specified URI. If `forceLoad` is `true`:<ul><li>Client-side routing is bypassed.</li><li>The browser is forced to load the new page from the server, whether or not the URI is normally handled by the client-side router.</li></ul> |
|
||||
| `OnLocationChanged` | An event that fires when the navigation location has changed. |
|
||||
| `ToAbsoluteUri` | Converts a relative URI into an absolute URI. |
|
||||
| `ToBaseRelativePath` | Given a base URI (for example, a URI previously returned by `GetBaseUri`), converts an absolute URI into a URI relative to the base URI prefix. |
|
||||
|
||||
The following component navigates to the app's Counter component when the button is selected:
|
||||
|
||||
```cshtml
|
||||
@page "/navigate"
|
||||
@using Microsoft.AspNetCore.Components
|
||||
@inject IUriHelper UriHelper
|
||||
|
||||
<h1>Navigate in Code Example</h1>
|
||||
|
||||
<button class="btn btn-primary" onclick="@NavigateToCounterComponent">
|
||||
Navigate to the Counter component
|
||||
</button>
|
||||
|
||||
@functions {
|
||||
private void NavigateToCounterComponent()
|
||||
{
|
||||
UriHelper.NavigateTo("counter");
|
||||
}
|
||||
}
|
||||
```
|
||||
|
|
Loading…
Reference in New Issue