Cómo crear NavMenu con submenú plegable en la aplicación .Net Core Blazor

Luego de consultar con expertos en el tema, programadores de deferentes áreas y maestros dimos con la solución al problema y la dejamos plasmada en esta publicación.

Solución:

No utilices data-toggle y data-target para ello.

Estos son utilizados por boostrap.js, sin embargo, no desea modificar el DOM de esa manera.

En su lugar, lo que debe hacer es usar una declaración if y, por lo tanto, dejar que Blazor se encargue de la representación:

    
         Fetch data
    
    @if (expandSubNav)
    
        
            Sub1
        
        
            Sub2
        
    

Y coloque el campo expandSubNav en su sección de código:

@code 

    private bool expandSubNav;

     Fetch data

@if (expandSubNav)

    
        Sub1
    
    
        Sub2
    

use div en lugar de NAVLINK. Navlink vuelve a cargar la página y restablece expandSubNav.

Mi solución, después de problemas con no cerrar, haga clic en el submenú:

funciona en el móvil:

@code

bool collapseNavMenu = true;

private bool expandSubNavSettings;


string baseMenuClass = "navbar-collapse d-sm-inline-flex flex-sm-row-reverse";

string NavMenuCssClass => baseMenuClass + (collapseNavMenu ? " collapse" : "");

void ToggleNavMenu()

    if(!expandSubNavSettings)
    
        collapseNavMenu = !collapseNavMenu;
    

valoraciones y reseñas

Recuerda algo, que tienes la capacidad de reseñar si te fue útil.

---

---

Utiliza Nuestro Buscador