英文:
Blazor Virtualize won't load more items
问题
我有一个使用简单的Virtualize项的WASM Blazor应用程序，它使用ItemsProvider来获取这些项：
<Virtualize Context="bobina" ItemSize="500" ItemsProvider="@GetCustomersProvider" OverscanCount="0">
这是方法：
private async ValueTask<ItemsProviderResult<Bobina>> GetCustomersProvider(ItemsProviderRequest request)
{
List<Bobina> lista = await Bobina.GetLista(request.StartIndex, request.Count);
return new ItemsProviderResult<Bobina>(lista, lista.Count());
}
Bobina.GetLista执行一个对harperDB的HTTP调用，并获取一些记录：
$"SELECT * FROM dev.bobine order by nome offset {skip} rows FETCH NEXT {take} ROWS ONLY";
为了测试目的，我将ItemSize设置为500px，因此该方法仅加载少量项（数据库中只有7项）。
当第一次调用完成时，Virtualize组件呈现一些项，但当我向下滚动页面时什么也不发生。
应该再次调用服务器以获取其他记录，但它没有这样做。
我看到许多在线示例执行与我相同的操作，而且都正常工作。
我使用mudblazor组件，因此我尝试注释掉所有这些组件并呈现一个简单的<table>标签，但结果相同。
我错在哪里？我该如何解决这个问题？
这里是完整的代码示例。
英文:
I have a WASM Blazor app with a simple Virtualize items that use ItemsProvider to get the items:
<Virtualize Context="bobina" ItemSize="500" ItemsProvider="@GetCustomersProvider" OverscanCount="0">
this is the method:
private async ValueTask<ItemsProviderResult<Bobina>> GetCustomersProvider(ItemsProviderRequest request)
{
List<Bobina> lista = await Bobina.GetLista(request.StartIndex, request.Count);
return new ItemsProviderResult<Bobina>(lista, lista.Count());
}
the Bobina.GetLista performs an http call to an harperDB and get some records:
$"SELECT * FROM dev.bobine order by nome offset {skip} rows FETCH NEXT {take} ROWS ONLY";
For test purpose I have set the ItemSize to 500px, so the method load only few items (inside the db there are only 7 items).
When the first call is done the Virtualize component renders some items but when I scroll down the page nothing happens.
It's supposed to call the server again to fetch some others records, but it doesn't do.
I have seen many online sample that do the same things I do and all works fine.
I use the mudblazor componets, so I thought to comment all these components and render a simple <table> tag, but the result is the same.
Where am i wrong? How can I resolve this issue?
Here the full code sample.
答案1
得分: 1
'Virtualize' 组件需要知道可用项目的总数，以确定在用户滚动时何时获取其他项目。
我认为 ItemsProviderResult 构造函数的第二个参数应该是可用项目的总数，而不是当前获取列表中的项目计数。
private async ValueTask<ItemsProviderResult<Bobina>> GetCustomersProvider(ItemsProviderRequest request)
{
List<Bobina> lista = await Bobina.GetLista(request.StartIndex, request.Count);
int totalItemCount = await Bobina.GetTotalItemCount(); // 添加一个方法来获取数据库中项目的总数
return new ItemsProviderResult<Bobina>(lista, totalItemCount);
}
然后：
public static async Task<int> GetTotalItemCount()
{
// 实现查询数据库中项目总数的逻辑
// 例如: "SELECT COUNT(*) FROM dev.bobine"
}
英文:
The 'Virtualize' component needs to know the total number of items available to determine when it should fetch additional items as the user scrolls.
I think the second parameter of the ItemsProviderResult constructor should be the total number of items available, not the count of items in the current fetched list.
private async ValueTask<ItemsProviderResult<Bobina>> GetCustomersProvider(ItemsProviderRequest request)
{
List<Bobina> lista = await Bobina.GetLista(request.StartIndex, request.Count);
int totalItemCount = await Bobina.GetTotalItemCount(); // Add a method to get the total number of items in the database
return new ItemsProviderResult<Bobina>(lista, totalItemCount);
}
And then:
public static async Task<int> GetTotalItemCount()
{
// Implement the logic to query the total number of items in the database
// Example: "SELECT COUNT(*) FROM dev.bobine"
}
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库，让每个人都能够通过互相帮助和分享经验来进步。
评论