Quantcast
Channel: Active questions tagged blazor - Stack Overflow
Viewing all articles
Browse latest Browse all 4839

How to active ActiveClass when the page is from a submenu using Blazor + Tailwind?

$
0
0

I had a menu created with Blazor and some items of menu has a submenu with items. I need set a background when the current page is relationated with the main menu item.

For example, I have this items in Menu:

HomeAboutBlog   Article 1   Article 2Contact

If the current page is Home, the Home menu should be with the backgorund blue, and so on.

But if the Article 1 or Article 2 was the current page, the Blog item should be with the background blue.

I'm using a NavLink componente to create a menu items

<NavLink ActiveClass="custom-nav-menu-link-active" Match="NavLinkMatch.All" href="@menuItem.HrefValue">Blog</NavLink>

And to create the submenu and sub items, I'm using a ul tag with one foreach simple

<ul id="submenu">    @foreach (var subItem in menuItem.Items)    {<li><NavLink href="@subItem.HrefValue" Match="NavLinkMatch.All">                Article 1                @if (!string.IsNullOrWhiteSpace(subItem.ArrowDropdownUrl))                {<img src="@subItem.ArrowDropdownUrl" alt="Dropdown Icon" class="iconmenuwithicon" />                }</NavLink></li>    }</ul>

For now when I click in Blog item the ActiveClass working very well, but when I click in some sub item not any menu item receive the backgorund blue, because the NavLink set the ActiveClass only in the item that had the URL correspondence.

Exists a way to implement the functionality that I nedd?


Viewing all articles
Browse latest Browse all 4839

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>