如何在通用表模板内的Blazor WebAssembly中的Virtualize Component中指定TItem的类

Question

我正在blazor webassembly项目中构建一个通用表模板。根据文档，我设置了我的表模板，并尝试在我的表中启用虚拟化，如下所示。

TableTemplate.rarzor:

@typeparam TItem
<table class="@CssClass">
<thead>
<tr>@TableHeader</tr>
</thead>
<tbody>
@if (Virtualize)
{
<Virtualize Context="item" Items="Items">
<ItemContent>
<tr>@RowTemplate(item)</tr>
</ItemContent>
<Placeholder>
<p>Loading..</p>
</Placeholder>
</Virtualize>
}
else
{
@foreach (var item in Items)
{
<tr>@RowTemplate(item)</tr>
}
}
</tbody>
</table>

TableTemplate.rarzor.cs:

public partial class TableTemplate<TItem>
{
[Parameter]
public string CssClass { get; set; }
[Parameter]
public bool Virtualize { get; set; }
[Parameter]
public RenderFragment TableHeader { get; set; }
[Parameter]
public RenderFragment<TItem> RowTemplate { get; set; }
[Parameter]
public IReadOnlyList<TItem> Items { get; set; }
}

但我得到了以下错误，

方法的类型参数'类型推断。CreateVirtualize_0(RenderTreeBuilder，int，int，ICollection，int，RenderFragment，int，无法从用法

如何在Virtualize组件中指定TItem的类型？请协助。

Answer 1

TItem是一个泛型类型，因此您需要将其移交给virtualize组件(也是一个泛型(，如下所示：

@typeparam TItem
<table class="@CssClass">
<thead>
<tr>@TableHeader</tr>
</thead>
<tbody>
@if (Virtualize)
{
<Virtualize Context="item" Items="Items" TItem="TItem">
<ItemContent>
<tr>@RowTemplate(item)</tr>
</ItemContent>
<Placeholder>
<p>Loading..</p>
</Placeholder>
</Virtualize>
}
else
{
@foreach (var item in Items)
{
<tr>@RowTemplate(item)</tr>
}
}
</tbody>
</table> 

此外，您的物品不能是public IReadOnlyList<TItem> Items { get; set; }，因为您会遇到一个异常，即无法将其转换为ICollection<TItem>

所以这部分应该是：

[Parameter]
public ICollection<TItem> Items { get; set; }