卡片 (Card)

由标题和内容组成。

概述

由标题和内容组成

代码演示

1.默认示例

Card1

Card Body

namespace WebSite.Docus.View.Cards;

class Card1 : BaseComponent
{
    protected override void BuildRenderTree(RenderTreeBuilder builder)
    {
        builder.Div("demo-card", attr =>
        {
            builder.Component<Card>()
                   .Set(c => c.Icon, "fa fa-list")
                   .Set(c => c.Name, "Card1")
                   .Set(c => c.Body, BuildBody)
                   .Build();
        });
    }

    private void BuildBody(RenderTreeBuilder builder)
    {
        builder.Span("Card Body");
    }
}

2.Head模板示例

这里是自定义

Card Body

namespace WebSite.Docus.View.Cards;

class Card2 : BaseComponent
{
    protected override void BuildRenderTree(RenderTreeBuilder builder)
    {
        builder.Div("demo-card", attr =>
        {
            builder.Component<Card>()
                   .Set(c => c.Head, BuildHead)
                   .Set(c => c.Body, BuildBody)
                   .Build();
        });
    }

    private void BuildHead(RenderTreeBuilder builder)
    {
        builder.Span("这里是自定义");
    }

    private void BuildBody(RenderTreeBuilder builder)
    {
        builder.Span("Card Body");
    }
}