Blazor中实现数据列表分页需定义currentPage、pageSize、totalItems和paginatedData，通过Skip/Take切片获取当前页数据，计算totalPages并渲染页码导航，支持首页、上一页、下一页、末页跳转。
Blazor 中实现数据列表分页，核心是控制每页显示数量、当前页码、总条数，并配合 UI 触发页码切换。不依赖第三方组件也能轻松完成，关键是把“数据切片”和“页码状态管理”理清楚。
一、基础分页参数定义
在组件（.razor）的 @code 块中声明几个必要字段：
- currentPage：当前页码（从 1 开始更符合用户直觉）
- pageSize：每页显示条数（如 10、20）
- totalItems：数据总条数（通常来自 API 或服务）
- paginatedData：当前页要展示的数据子集（计算属性或方法返回）
二、计算当前页数据（切片逻辑）
用 C# 的 skip 和 take 最直接：
private List- PaginatedData => AllItems .Skip((currentPage - 1) * pageSize) .Take(pageSize) .ToList();
注意：AllItems 是完整数据源（可来自服务、内存列表或异步加载结果）。如果数据量大，建议后端分页；前端分页仅适用于总数可控（比如 ≤ 5000 条）的场景。
通用产品企业网站(.NET2.0)1.0
下载
1、系统采用.net2.0开发，数据库access2、三层架构，数据层、逻辑层和表示层分离3、系统完全使用div＋css布局，可以灵活处理界面4、技术特点: 使用模板页，大大减少代码量 动态生成竖向导航菜单 ul li实现表格 各种自定义用户空间 Reapter等数据控件的灵活运用
三、生成页码导航 UI
用循环渲染页码按钮，常见做法是显示「首页、上一页、123…、下一页、末页」。简化版可先做连续页码：
- 算出总页数：int totalPages = (int)Math.Ceiling(totalItems / (double)pageSize);
- 用 @for (int i = 1; i 渲染按钮
- 每个按钮绑定点击事件：@onclick="() => GoToPage(i)"
- GoToPage(int page) 方法里校验范围并更新 currentPage，再触发重新渲染
四、支持跳转与边界处理
用户可能输入页码或点「上/下一页」，需加防护：
- 跳转前判断：if (page totalPages) page = totalPages;
- 「上一页」逻辑：currentPage = Math.Max(1, currentPage - 1);
- 「下一页」逻辑：currentPage = Math.Min(totalPages, currentPage + 1);
- 修改 currentPage 后，Blazor 会自动重绘 PaginatedData 和页码栏
基本上就这些。不需要额外库，几行逻辑 + 简单 UI 就能跑起来。重点是把“页码→索引→切片”的映射写对，其余都是围绕它展开的交互补充。
