Skip to content

MudStaticNavDrawerToggle close the drawer on page change #63

@Dunge

Description

@Dunge

Instead of keeping the current open state of the drawer, doing a navigation cause the drawer to close.

Sample:

<MudLayout Class="full-height">
    <MudAppBar Elevation="1">
        <MudBlazor.StaticInput.MudStaticNavDrawerToggle Icon="@Icons.Material.Filled.Menu" Color="Color.Dark" Edge="Edge.Start" DrawerId="navbar-drawer" />
        <Header />
    </MudAppBar>

    <MudDrawer id="navbar-drawer" Elevation="1" Variant="@DrawerVariant.Persistent" Breakpoint="@Breakpoint.Sm" ClipMode="DrawerClipMode.Always">
        <MudNavMenu>
            <MudNavLink Href="" Match="NavLinkMatch.All" Icon="@Icons.Material.Filled.Dashboard">Dashboard</MudNavLink>
            <MudNavLink Href="reports" Match="NavLinkMatch.All" Icon="@Icons.Material.Filled.BarChart">Reports</MudNavLink>
        </MudNavMenu>
    </MudDrawer>

    <MudMainContent Class="main-content-container">
        @Body
    </MudMainContent>
</MudLayout>

Clicking on a NavLink button change page, but close the panel.

I do not have this behavior if I run the app in full interactive mode and use a normal button / @bind-Open variable:

        <MudIconButton Icon="@Icons.Material.Filled.Menu" OnClick="(() => _drawerOpen = !_drawerOpen)" />
        <MudDrawer id="navbar-drawer" @bind-Open="_drawerOpen" Elevation="1" Variant="@DrawerVariant.Mini" Breakpoint="@Breakpoint.Sm" ClipMode="DrawerClipMode.Always">

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions