Par*_*a99 4 blazor razor-components blazor-webassembly
我正在使用 MudBlazor 组件库。为了显示表单按钮上的加载,文档指南如下:
<MudButton Disabled="@_processing" OnClick="ProcessSomething" Variant="Variant.Filled" Color="Color.Primary">
@if (_processing)
{
<MudProgressCircular Class="ms-n1" Size="Size.Small" Indeterminate="true"/>
<MudText Class="ms-2">Processing</MudText>
}
else
{
<MudText>Click me</MudText>
}
</MudButton>
Run Code Online (Sandbox Code Playgroud)
现在,由于我经常这样做,因此我想将此逻辑包装在另一个组件中。
以下组件不执行此操作:
@inherits MudButton
@code {
bool _loading;
[Parameter]
public bool Loading
{
get => _loading;
set
{
_loading = value;
Disabled = value;
}
}
[Parameter]
public new RenderFragment ChildContent
{
get => base.ChildContent;
set => base.ChildContent = ExtendContent(value);
}
private RenderFragment ExtendContent(RenderFragment baseContent) => __builder =>
{
if (Loading)
{
<MudProgressCircular Class="ms-n2" Size="Size.Small" Indeterminate="true" />
}
@baseContent
};
}
Run Code Online (Sandbox Code Playgroud)
我收到此错误:
类型“<my_component>”声明了多个与名称“childcontent”匹配的参数。参数名称不区分大小写并且必须是唯一的。
创建一个用于加载内容的组件:
ButtonLoadingContent.razor
@using MudBlazor
<MudProgressCircular Class="ms-n1" Size="Size.Small" Indeterminate="true" />
<MudText Class="ms-2">Processing</MudText>
Run Code Online (Sandbox Code Playgroud)
BaseLoadingMudButton.cs
using MudBlazor;
public class BaseLoadingMudButton<TComponent> : MudButton
where TComponent : ComponentBase
{
protected override void OnParametersSet()
{
Disabled = Loading;
if (Loading is true)
{
ChildContent = builder =>
{
builder.OpenComponent<TComponent>(sequence: 1);
builder.CloseComponent();
};
}
base.OnParametersSet();
}
[Parameter]
public bool Loading { get; set; }
}
Run Code Online (Sandbox Code Playgroud)
LoadingMudButton.cs
public class LoadingMudButton : BaseLoadingMudButton<ButtonLoadingContent> { }
Run Code Online (Sandbox Code Playgroud)
<LoadingMudButton Loading=_processing OnClick="ProcessSomething" Variant="Variant.Filled" Color="Color.Primary">
<MudText>Click me</MudText>
</LoadingMudButton>
Run Code Online (Sandbox Code Playgroud)
为什么它有效?我没有使用.razor文件进行继承。基本组件不必使用泛型,我将其包含在内是为了使其更加灵活并作为示例。
| 归档时间: |
|
| 查看次数: |
1509 次 |
| 最近记录: |