面包屑 (Breadcrumb)

页面导航面包屑组件。

概述

  • 数据源支持当前菜单和MenuItem列表
  • 可定义图标和MenuItem事件

代码演示

1.默认示例

namespace WebSite.Docus.Nav.Breadcrumbs;

class Breadcrumb1 : BaseComponent
{
    private readonly List<MenuItem> Items = new()
    {
        new MenuItem("Test1", "测试1", "fa fa-home"),
        new MenuItem("Test2", "测试2", "fa fa-user"),
        new MenuItem("Test3", "测试3")
    };

    protected override void BuildRenderTree(RenderTreeBuilder builder)
    {
        builder.Component<Breadcrumb>().Set(c => c.Items, Items).Build();
    }
}

2.事件示例

namespace WebSite.Docus.Nav.Breadcrumbs;

class Breadcrumb2 : BaseComponent
{
    protected override void BuildRenderTree(RenderTreeBuilder builder)
    {
        builder.Component<Breadcrumb>().Set(c => c.Items, new()
        {
            new MenuItem("Test1", "测试1", "fa fa-home"),
            new MenuItem("Test2", "测试2", "fa fa-user"),
            new MenuItem("Test3", "点击试试") { Action = () => UI.Alert("点击测试...") }
        }).Build();
    }
}