Blazor:未设置基类的剃刀组件继承参数



我的一个剃刀组件库有问题。

我为我的组件提供了一个抽象的基类RazorHtmlComponent,其中包含一个参数属性[Parameter] public string InlineClass { get; set; }该参数属性将用于将 css 类映射到实际组件。然后,我为每个组件提供了另一个基类,其中包含组件特定的属性,其定义如下:abstract class BaseRazorButton: RazorHtmlComponent

在此示例中,我的组件RazorButton.razor继承自抽象按钮基类BaseRazorButton

问题是,当我实例化一个 razor 按钮并将属性InlineClass设置为任何值时,它在我的实际RazorButton实例中保持 null。

下面是一个最小的代码示例,以便更好地理解:

基类:

public abstract class RazorHtmlComponent : ComponentBase, IRazorHtmlComponent
{
[Parameter] public string InlineClass { get; set; }
public DomDefinitionMapper ClassMapper { get; }
...
protected RazorHtmlComponent()
{
ClassMapper = new DomDefinitionMapper(InlineClass);
}

Dom 定义映射器:

public class DomDefinitionMapper
{
public List<Func<string>> DefinitionRepository { get; } = new List<Func<string>>();
public DomDefinitionMapper(string definition = "")
{
if (!string.IsNullOrEmpty(definition))
{
DefinitionRepository.Add(() => definition);
}
}
public string GetDefinitions(char separator = default)
=> separator.Equals(default) ? 
string.Join(" ", DefinitionRepository.Select(i => i()).Where(i => i != null)) 
: string.Join($" {separator}", DefinitionRepository.Select(i => i()).Where(i => i != null));
}

按钮基类:

public abstract class BaseRazorButton: RazorHtmlComponent
{
...
}

剃须刀按钮组件:

@inherits BaseRazorButton
<button class="@ClassMapper.GetDefinitions()">
@Text
</button>

Razor 按钮的实例化:

<RazorButton InlineClass="page" 
Text="1"/>

当我在浏览中检查 in 时,未设置InlineClass参数在其中定义的类"page"。在调试模式下,ClassMapperDefinitionRepository不包含类。

我错过了什么吗?我只是不明白为什么它不起作用:/

如果你在构造器中调用它:

[Parameter] public string InlineClass { get; set; }
...
protected RazorHtmlComponent()
{
ClassMapper = new DomDefinitionMapper(InlineClass);
}

参数尚未设置。这将是调用OnInitializedOnInitializedAsync的时候。
你的RazorHtmlComponent必须来自ComponentBase

public abstract class RazorHtmlComponent : ComponentBase, IRazorHtmlComponent
{
[Parameter] public string InlineClass { get; set; }
public DomDefinitionMapper ClassMapper { get; }
...
protected override void OnInitialized()
{
ClassMapper = new DomDefinitionMapper(InlineClass);
}

相关内容

  • 没有找到相关文章

最新更新