menu

Blazor

  • Code Examples
  • Upgrade Guide
  • User Guide
  • Demos
  • Support
  • Forums
  • Download
Class BreadcrumbItem - API Reference

    Show / Hide Table of Contents

    Class BreadcrumbItem

    A class that represents breadcrumb component item of SfBreadcrumb component.

    Inheritance
    System.Object
    BreadcrumbItem
    Namespace: Syncfusion.Blazor.Navigations
    Assembly: Syncfusion.Blazor.dll
    Syntax
    public class BreadcrumbItem : OwningComponentBase
    Remarks

    You can render icon only, text only, icon and text breadcrumb item by specifying value to corresponding property. Additional attributes can be added to Breadcrumb item using @attributes directive.

    Examples

    In the below code example, a basic Breadcrumb item has been added using BreadcrumbItem tag directive.

    <SfBreadcrumb>
        <BreadcrumbItems>
            <BreadcrumbItem Text="Home" Url="https://blazor.syncfusion.com/demos/"></BreadcrumbItem>
            <BreadcrumbItem Text="Components" Url="https://blazor.syncfusion.com/demos/datagrid/overview"></BreadcrumbItem>
            <BreadcrumbItem Text="Navigations" Url="https://blazor.syncfusion.com/demos/menu-bar/default-functionalities"></BreadcrumbItem>
            <BreadcrumbItem Text="Breadcrumb" Url="https://blazor.syncfusion.com/demos/breadcrumb/default-functionalities"></BreadcrumbItem>
        </BreadcrumbItems>
    </SfBreadcrumb>

    Constructors

    BreadcrumbItem()

    Declaration
    public BreadcrumbItem()

    Properties

    ChildContent

    Gets or sets the child content for the Breadcrumb item. If the child content is not specified breadcrumb item is rendered using Text content.

    Declaration
    public RenderFragment ChildContent { get; set; }
    Property Value
    Type Description
    Microsoft.AspNetCore.Components.RenderFragment

    The template content. The default value in null.

    Examples

    In the below code example, content has been set to BreadcrumbItem using Text property and ChildContent property.

    <SfBreadcrumb>
        <BreadcrumbItems>
            <BreadcrumbItem><span>Components</span></BreadcrumbItem>
        </BreadcrumbItems>
    </SfBreadcrumb>

    Disabled

    Gets or sets whether the Breadcrumb item is disabled or not.

    Declaration
    public bool Disabled { get; set; }
    Property Value
    Type Description
    System.Boolean

    true, if the Breadcrumb item is disabled. The default value is false.

    Examples
    <SfBreadcrumb">
        <BreadcrumbItems>
            <BreadcrumbItem Text="Home" Url="https://blazor.syncfusion.com/demos/"></BreadcrumbItem>
            <BreadcrumbItem Disabled="true" Text="Components" Url="https://blazor.syncfusion.com/demos/datagrid/overview"></BreadcrumbItem>
            <BreadcrumbItem Text="Navigations" Url="https://blazor.syncfusion.com/demos/menu-bar/default-functionalities"></BreadcrumbItem>
        </BreadcrumbItems>
    </SfBreadcrumb>

    HtmlAttributes

    Gets or sets a collection of additional attributes that will be applied to the breadcrumb item element.

    Declaration
    public Dictionary<string, object> HtmlAttributes { get; set; }
    Property Value
    Type Description
    System.Collections.Generic.Dictionary<System.String, System.Object>
    Remarks

    Additional attributes can be added by specifying as inline attributes or by specifying @attributes directive.

    Examples

    In the below code example, title attribute added as inline in BreadcrumbItem tag directive.

    <SfBreadcrumb>
        <BreadcrumbItems>
            <BreadcrumbItem Text="Home" title="Home"></BreadcrumbItem>
        </BreadcrumbItems>
    </SfBreadcrumb>

    IconCss

    Gets or sets a CSS class string to include an icon or image for the breadcrumb item.

    Declaration
    public string IconCss { get; set; }
    Property Value
    Type Description
    System.String

    Accepts a CSS class string separated by space to include an icon or image for the breadcrumb item. The default value is String.Empty.

    Examples
    <SfBreadcrumb>
        <BreadcrumbItems>
            <BreadcrumbItem IconCss="e-icons e-home"></BreadcrumbItem>
        </BreadcrumbItems>
    </SfBreadcrumb>

    Text

    Gets or sets the text content of the Breadcrumb item.

    Declaration
    public string Text { get; set; }
    Property Value
    Type Description
    System.String

    Accepts a string value. The default value is String.Empty.

    Remarks

    Set child content within BreadcrumbItem tag directive, to render as HTML content.

    Examples

    In the below code example, content has been set to BreadcrumbItem using Text property and ChildContent property.

    <SfBreadcrumb>
        <BreadcrumbItems>
            <BreadcrumbItem Text="Home"></BreadcrumbItem>
        </BreadcrumbItems>
    </SfBreadcrumb>
    <SfBreadcrumb>
        <BreadcrumbItems>
            <BreadcrumbItem>Home</BreadcrumbItem>
            <BreadcrumbItem><span>Components</span></BreadcrumbItem>
        </BreadcrumbItems>
    </SfBreadcrumb>

    Url

    Gets or sets the Url of the Breadcrumb item and that will be navigated when clicked.

    Declaration
    public string Url { get; set; }
    Property Value
    Type Description
    System.String

    Accepts Url string value. The default value is String.Empty.

    Remarks

    When Url has not been set, you can customize the item navigation using ItemClicked event.

    Examples
    <SfBreadcrumb">
        <BreadcrumbItems>
            <BreadcrumbItem Text="Home" Url="https://blazor.syncfusion.com/demos/"></BreadcrumbItem>
            <BreadcrumbItem Text="Components" Url="https://blazor.syncfusion.com/demos/datagrid/overview"></BreadcrumbItem>
            <BreadcrumbItem Text="Navigations" Url="https://blazor.syncfusion.com/demos/menu-bar/default-functionalities"></BreadcrumbItem>
        </BreadcrumbItems>
    </SfBreadcrumb>

    Methods

    Dispose(Boolean)

    Declaration
    protected override void Dispose(bool disposing)
    Parameters
    Type Name Description
    System.Boolean disposing

    OnInitializedAsync()

    Declaration
    protected override Task OnInitializedAsync()
    Returns
    Type Description
    System.Threading.Tasks.Task
    Back to top Generated by DocFX
    Copyright © 2001 - 2023 Syncfusion Inc. All Rights Reserved