从 class 属性设置并显示 Blazor 视图组件

Question

我正在尝试基于 blazor 中的 class 属性呈现不同的页面，并且只有 1 个标记。

在 WPF 中，我能够创建多个视图并在 object 的道具中指定要使用 UserControl class 渲染的视图。

WPF 数据上下文：

public UserControl DetailView { get; set; }

WPF 父查看：

<UserControl Content="{Binding DetailView}"></UserControl>

这样我就能够根据属性动态呈现不同的页面。

我试图在 Blazor 中实现同样的目标。 我不想在我的 blazorView 中使用一堆 If else

Answer 1

我认为DynamicComponent是您正在寻找的。

文档：

https://docs.microsoft.com/en-us/aspnet/core/blazor/components/dynamiccomponent?view=aspnetcore-6.0

使用select元素动态选择应呈现的组件的示例：

<select @bind="selectedComponentIndex">
    @for (var i = 0; i < componentTypes.Count; i++)
    {
        <option value="@i">@componentTypes[i].Name</option>
    }
</select>

<DynamicComponent Type="componentTypes[selectedComponentIndex]" />

@code {
    private int selectedComponentIndex = 0;

    private List<Type> componentTypes = new List<Type>
    {
        typeof(Component1),
        typeof(Component2),
        typeof(Component3),
    };
}