Breadcrumbs

Represents a series of links used to show the user's current location.

Basic Breadcrumbs

<MudBreadcrumbs Items="_items"></MudBreadcrumbs>
@code {
    private List<BreadcrumbItem> _items =
    [
        new("Home", href: "#"),
        new("Link 1", href: "#"),
        new("Link 2", href: null, disabled: true)
    ];
}
Custom Separator

<MudBreadcrumbs Items="_items" Separator=">"></MudBreadcrumbs>
@code {
    private List<BreadcrumbItem> _items =
    [
        new("Home", href: "#"),
        new("Link 1", href: "#"),
        new("Link 2", href: null, disabled: true)
    ];
}
Render Fragments

It is also possible to provide a RenderFragment as a template.

<MudBreadcrumbs Items="_items">
    <SeparatorTemplate>
        <MudIcon Icon="@Icons.Material.Filled.ArrowForward" Size="Size.Small" />
    </SeparatorTemplate>
</MudBreadcrumbs>
@code {
    private List<BreadcrumbItem> _items =
    [
        new("Home", href: "#"),
        new("Link 1", href: "#"),
        new("Link 2", href: null, disabled: true)
    ];
}
An unhandled exception has occurred. See browser dev tools for details. Reload 🗙