ASP.NET Core Blazor RenderTreeBuilder 创建组件时传回调参数

2021-11-18 乐帮网

blazor

首先你需要了解ASP.NET Core Blazor中动态创建组件的功能，其中使用到了RenderTreeBuilder。详细参考：https://docs.microsoft.com/zh-cn/aspnet/core/blazor/advanced-scenarios?view=aspnetcore-6.0
示例里有代码：

@page "/built-content"

<h1>Build a component</h1>

<div>
    @CustomRender
</div>

<button @onclick="RenderComponent">
    Create three Pet Details components
</button>

@code {
    private RenderFragment? CustomRender { get; set; }

    private RenderFragment CreateComponent() => builder =>
    {
        for (var i = 0; i < 3; i++) 
        {
            builder.OpenComponent(0, typeof(PetDetails));
            builder.AddAttribute(1, "PetDetailsQuote", "Someone's best friend!");
            builder.CloseComponent();
        }
    };

    private void RenderComponent()
    {
        CustomRender = CreateComponent();
    }
}

在上述代码里我们动态构建一个组件并且传递了一个参数PetDetailsQuote，它是一个字符串类型的。但是当我们需要传一个回调参数时应该怎么写呢？
这个时候我们可以使用EventCallback，方法如下：

var callback = EventCallback.Factory.Create<string>(this, arg =>
{
    // do something
});

或者无返回参数时：

var callback = EventCallback.Factory.Create(this, OnCallback);

builder.OpenComponent(0, componentType);
builder.AddAttribute(1, "OnSomething", callback);
builder.CloseComponent();

关注我的微信公众号
在公众号里留言交流
投稿邮箱：1052839972@qq.com

庭院深深深几许？杨柳堆烟，帘幕无重数。
玉勒雕鞍游冶处，楼高不见章台路。
雨横风狂三月暮。门掩黄昏，无计留春住。
泪眼问花花不语，乱红飞过秋千去。

如果感觉对您有帮助
欢迎向作者提供捐赠
这将是创作的最大动力