asp.net-core - Blazor 组件分页

Question

我正在开发 Blazor 应用程序，并且有一个显示记录列表的组件(从 Entity Framework 实体中检索)，想知道在组件上实现分页的最佳和最简单的方法是什么。

任何帮助，将不胜感激。

Answer 1

在 Blazor 中，您可以完全控制 DOM。当您使用 EF 时，您可以简单地为您的分页执行 Skip and Take :

private int pageSize = 100;
private int pageNumber = 1;   

在 HTML 中:

for(int p = 1; p<= list.Count() / pageSize ; p++) {
<button type="button" @onclick="(e=>HandleChangePage(p))">@p</button>
}

处理更改页面:

void HandleChangePage(int p) {
  pageNumber  = p;
  var page = list.Skip((p-1) * pageSize).Take(pageSize);
}

这是进行分页的最简单方法，
现在您可以继续创建您的分页列表组件
现在您需要将列表作为参数传递给组件

[Parameter]
public List<ClassName> list {get;set;}

如果您想使用通用列表，请查看 Template context parameters