如何在.Net Blazor中呈现母版页中的子页组件

Question

我正试图在继承我的基本组件的所有其他页面上呈现一个在基本组件中定义的组件。

这里是我的组件的最小代码实现。

BaseView.razor:

@inherits BaseComponent<TModel,TRepo>
@typeparam TModel
@typeparam TRepo  where TRepo : IGlobalRepository
<!--NotificationView.razor component-->
<NotificationView VALIDATION_RESULT="Data.ValidationErrors"/>

NotificationView.razor:

<MudButton  @onclick="@(DisplayNotifications)" Color="Color.Secondary">
Notifications
</MudButton>

索引.razor:

@page "/"
@inherits BaseView<LOGS,IGlobalRepository>
<h1>Hello, world!</h1>
Welcome to your new app.<br />

NotificationView组件根本没有呈现，我是不是遗漏了什么？有办法让它发挥作用吗？

我正在使用.Net 6 SDK

Answer 1

您希望MudButton位于<h1>Hello, world!</h1>之上还是之下？

您无法控制这一事实是不支持标记继承的主要原因。您可以继承C#代码，但不能继承HTML(剃刀(部分。

而继承被高估了，更喜欢组合。它要灵活得多。

@page "/"
@* @inherits BaseView<LOGS,IGlobalRepository> *@
<h1>Hello, world!</h1>
<BaseView TModel="LOGS" TRepo="IGlobalRepository" />
Welcome to your new app.<br />

或者反过来，给BaseView一个ChildContent参数，并使其成为包装器：

<BaseView TModel="LOGS" TRepo="IGlobalRepository" >
<h1>Hello, world!</h1>
Welcome to your new app.
</BaseView>