徽章 (Badge)

用于提示新消息。

概述

  • 支持默认、主要、成功、信息、警告、危险样式

代码演示

1.默认示例

消息中心10
消息中心10
消息中心10
消息中心10
消息中心10
消息中心10
namespace WebSite.Docus.View.Badges;

class Badge1 : BaseComponent
{
    protected override void BuildRenderTree(RenderTreeBuilder builder)
    {
        BuildBadge(builder, StyleType.Default, "10");
        BuildBadge(builder, StyleType.Primary, "10");
        BuildBadge(builder, StyleType.Success, "10");
        BuildBadge(builder, StyleType.Info, "10");
        BuildBadge(builder, StyleType.Warning, "10");
        BuildBadge(builder, StyleType.Danger, "10");
    }

    private static void BuildBadge(RenderTreeBuilder builder, StyleType style, string text)
    {
        builder.Div("demo-badge", attr =>
        {
            builder.Text("消息中心");
            builder.Badge(style, text);
        });
    }
}