Blazor - 向当前元素添加活动类

问题描述 投票:0回答:1

试图用Blazor完全开发一个网站。

我想知道如何将活动类添加到当前选中的元素中,我有一个侧边菜单栏,如果能知道用户在哪个页面,那就太棒了。

找到了这个 JavaScript解决方案 但我想通过#c

有什么办法可以实现吗?

blazor
1个回答
0
投票

像往常一样绑定定义一个属性,并在class="style @prop "中绑定。


0
投票

在Blazor中使用NavLink标签在页面之间进行导航。有一个名为NavLinkMatch的属性,它将在当前路径匹配时自动为您应用 "active "类。

欲了解更多信息,请查看以下内容 https:/docs.microsoft.comen-usaspnetcoreblazorrouting?view=aspnetcore-3.1#navlink-component。

希望对你有所帮助:)


0
投票

Microsoft.AspNetCore.Components.Routing.NavLink组件自动添加 "active "类(或您选择的类)。示例代码如下。

<ul class="nav flex-column">
    <li class="nav-item px-3">
        <NavLink class="nav-link" href="" Match="NavLinkMatch.All">
            <span class="oi oi-home" aria-hidden="true"></span> Home
        </NavLink>
    </li>
    <li class="nav-item px-3">
        <NavLink class="nav-link" href="counter">
            <span class="oi oi-plus" aria-hidden="true"></span> Counter
        </NavLink>
    </li>
    <li class="nav-item px-3">
        <NavLink class="nav-link" href="fetchdata">
            <span class="oi oi-list-rich" aria-hidden="true"></span> Fetch data
        </NavLink>
    </li>
</ul>

源代码。https:/docs.microsoft.comen-usdotnetapimicrosoft.aspnetcore.component.routing.navlink?view=aspnetcore-3.1。

© www.soinside.com 2019 - 2024. All rights reserved.