Blazor中使用@typeparam时，如何将父组件参数/对象经泛型包装组件传至子组件

一、通过泛型包装组件传递父组件参数给子组件（使用@typeparam） #

核心思路是让泛型包装组件作为中转层，接收父组件的参数后直接传递给子组件，保持类型一致性。

1. 定义子组件（接收参数） #

@typeparam T

<div>子组件接收的值：@Item?.ToString()</div>

@code {
    [Parameter]
    public T? Item { get; set; }
}

2. 定义泛型包装组件（中转参数） #

@typeparam T
<ChildComponent Item="WrappedItem" />

@code {
    // 声明与子组件参数匹配的泛型参数
    [Parameter]
    public T? WrappedItem { get; set; }
}

3. 父组件中使用包装组件传递参数 #

<h3>父组件</h3>
<GenericWrapper T="string" WrappedItem="来自父组件的字符串参数" />
<GenericWrapper T="int" WrappedItem="123" />

二、通过泛型包装组件传递对象给子组件 #

针对自定义对象的传递，利用泛型保证类型安全，包装组件同样承担中转角色。

1. 定义自定义对象类 #

public class Product
{
    public int Id { get; set; }
    public string Name { get; set; } = string.Empty;
    public decimal Price { get; set; }
}

2. 定义接收对象的子组件 #

@typeparam TProduct

@if (Product != null)
{
    <div>
        商品ID：@Product.Id<br/>
        商品名称：@Product.Name<br/>
        商品价格：@Product.Price
    </div>
}

@code {
    [Parameter]
    public TProduct? Product { get; set; }
}

3. 定义泛型对象包装组件 #

@typeparam T
<ProductChild TProduct="T" Product="WrappedObject" />

@code {
    [Parameter]
    public T? WrappedObject { get; set; }
}

4. 父组件传递对象实例 #

<h3>传递对象示例</h3>
<ObjectWrapper T="Product" WrappedObject="@new Product { Id = 1, Name = "Blazor实战", Price = 59.9m }" />

注意事项 #

• 泛型参数的约束可按需添加，比如@typeparam T where T : class确保传递引用类型
• 参数命名尽量保持语义清晰，避免传递链中的混淆
• 若子组件需要双向绑定，包装组件需同步声明对应的[Parameter]和[Parameter] public EventCallback<T> ItemChanged { get; set; }回调

内容的提问来源于stack exchange，提问作者trojaxat