如何将变量传递到 blazor 中组件的 @typeparam

Question

我已经创建了一个 TestComponent.razor

@typeparam TValue

@code {
    private TValue Type { get; set; }
    [Parameter] public string String { get; set; }
}

在 index.razor 页面中，我有以下内容：

@page "/"

<h1>Hello, world!</h1>

Welcome to your new app.

<SurveyPrompt Title="How is Blazor working for you?" />

<ComponentFactory.Data.SampleComponent TValue="@myType" String="@myString"></ComponentFactory.Data.SampleComponent>

@code{
    Type myType { get; set; } = typeof(string);
    string myString { get; set; } = "hello";
}

我不能将Type myType 传递给TValue，除非我将myType 设为当前页面的@typeparam

为什么会发生这种情况？有没有办法将变量传递到组件的@typeparam？

Answer 1

您不能使用“变量”泛型类型参数创建 Blazor 组件。就像 C# 中的普通泛型类型一样，这些类型参数需要在编译时知道，因此您必须在创建组件时直接指定类型。

在您的情况下，可能如下所示：

<SampleComponent TValue="string" Type="some string" String="@myString" />

由于您已将泛型类型参数 TValue 用于属性 Type，因此您也可以显式省略 TValue="string" 并让编译器为您完成：

<SampleComponent Type="some string" String="@myString" />

---

如果你想动态创建一个组件，那么你可以做的是动态创建一个渲染组件的RenderFragment。那样

在运行时创建具有动态类型参数的通用组件的唯一方法是使用反射。您可以创建RenderFragment 来动态创建组件：

<div>
   @SampleComponentInstance
</div>

@code{
    RenderFragment SampleComponentInstance => builder =>
    {
        var type = typeof(SampleComponent<>).MakeGenericType(new[] { MyType });
        builder.OpenComponent(1, type);
        builder.AddAttribute(2, "String", MyString);
        builder.CloseComponent();
    };

    Type MyType { get; set; } = typeof(string);
    string MyString { get; set; } = "hello";
}

这将在 div 内呈现带有泛型类型参数 MyType 的 SampleComponent。