0

我有这个基本的虚拟化列表,我使用 ItemsProvider 在其中加载项目:

<Virtualize @ref="_listbox" ItemsProvider="ProvideItems">
    <ItemContent>
        <div @key="context"
             class="item-level-@context.level">
             @context.Label
        </div>
    </ItemContent>             
</Virtualize>

private async ValueTask<ItemsProviderResult<Item>> ProvideItems(ItemsProviderRequest request)
{
    using var db = _dbContextFactory.CreateDbContext();
    var query = db.Items
        .GroupBy(e => e.Category)
        .OrderByDescending(e => e.Key)
        .Select((group, index) => new Item
        {
           Label = group.Key, 
           Count = group.Count(),
           Index = index,
        });

    if (_totalCount == null)
    {
        _totalCount = await query.CountAsync(request.CancellationToken);
    }
    var items = await query.Skip(request.StartIndex)
        .Take(request.Count)
        .ToArrayAsync();
    return new ItemsProviderResult<Item>(items, _totalCount.GetValueOrDefault());
}


class ItemModel
{
   int Index {get; set; }
   string Label {get; set;}
   int Count {get; set;}
   // int Level {get; set;} // 0 means root
   // List<ItemModel> Children {get; set;}
}

当用户单击和项目时,它应该被展开。

如何在按需加载子项时使项目可扩展?

这不是微不足道的练习,也许有人已经这样做了。该组件可能应该跟踪展开的项目,以便计算在用户滚动时应该提供哪些项目。

4

1 回答 1

0

我意识到我在这里参加派对很晚(将近一年,但没有人回答你,我讨厌我)但我想通了这一点,并认为我会分享。我有一个“树状”的情况,table如果用户选择,我会在多行中呈现父行的折叠和扩展。我的IsVisible bool对象上IsExpanded bool有一个根据checkbox.

然后在我的中,ItemsProvider我只是IsVisible在返回之前对属性进行linq 查询和过滤ItemsProviderResult

public async ValueTask<ItemsProviderResult<PerformanceClaimMeasurementGridViewModel>> LoadMeasurements(ItemsProviderRequest request) {
  var result = AllMeasurements
    .Where(x => x.IsVisible == true);

  return new ItemsProviderResult<PerformanceClaimMeasurementGridViewModel>(
    result
      .Skip(request.StartIndex)
      .Take(request.Count),
      result.Count()
  );
}
于 2022-01-26T15:21:31.807 回答