在Blazor组件中获取当前Url

Question

我需要知道当前页面的url,以检查是否必须将某种样式应用于元素.下面的代码就是一个例子.

@using Microsoft.AspNetCore.Blazor.Services
@inject IUriHelper UriHelper
@implements IDisposable

<h1>@url</h1>
<nav>
    <div class="nav-wrapper">
        <a href="#" class="brand-logo">Blazor</a>
        <ul id="nav-mobile" class="right hide-on-med-and-down">
            <li>
                <NavLink href="/" Match=NavLinkMatch.All>
                    Home
                </NavLink>
            </li>
            <li>
                <NavLink href="/counter">
                    Counter
                </NavLink>
            </li>
            <li>
                <NavLink href="/fetchdata">
                    Fetch data
                </NavLink>
            </li>
        </ul>
    </div>
</nav>

@functions {

    private string url = string.Empty;

    protected override void OnInit()
    {
        url = UriHelper.GetAbsoluteUri();
        UriHelper.OnLocationChanged += OnLocationChanged;
    }

    private void OnLocationChanged(object sender, LocationChangedEventArgs e)
    {
        url = newUriAbsolute;
    }

    public void Dispose()
    {
        UriHelper.OnLocationChanged -= OnLocationChanged;
    }
}

我使用了与Blazor存储库中的NavLink组件相同的方法,但它没有用.有任何想法吗？.

Answer 1

简而言之,使用来自IUriHelper的GetAbsoluteUri():

1)不要忘记在注射时设置UriHelper Uri:

@inject NavigationManager MyNavigationManager

或者在基类继承中获得"代码隐藏"体验NavigationManager:

using Microsoft.AspNetCore.Components;
...
[Inject] 
public NavigationManager MyNavigationManager {get; set;}

2)调用.razor方法:

@page "/navigate"
@inject NavigationManager MyNavigationManager

<h1>Current url</h1>

<p>@(MyNavigationManager.Uri)</p>

编辑 于0.8.0,.cs已移至Uri命名空间.

Answer 2

首先，注入NavigationManager需要获取当前URL的组件，如下所示：

@inject NavigationManager NavManager

现在使用以下行获取当前 URL：

string Url = NavManager.Uri.ToString();

Answer 3

OnLocationChanged连接到页面或组件中的事件是没有用的，因为它们是根据需要加载和处理的。

您应该在 app.cshtml 中注册此事件，因为该事件不会被处理。