TreeList分页
TreeList组件提供对分页的支持。
在本文中:
基础知识
- 要启用分页，需要设置TreeList
可分页参数真正的。 - 属性设置一次呈现的项数
页大小参数(默认为10)。 - 如果需要，通过其整数设置TreeList的当前页面
页面财产。 - 您可以通过附加功能进一步定制寻呼机界面寻呼机设置。
分页是针对当前展开和可见的项计算的。折叠节点中的子节点不包括在总计数和当前页中。因此，展开或折叠一个节点(行)可以更改当前页面上看到的项。
在Telerik TreeList中启用分页
启用分页并从第二个页面开始。 @code {public List Data {get;设置;} protected override async任务OnInitializedAsync(){数据=等待GetTreeListData();} //样本模型和数据生成的公共类Employee{公共int Id {get;设置;}公共int?ParentId {get;设置;}公共字符串名称{获取; set; } } async Task> GetTreeListData() { List data = new List(); for (int i = 1; i < 15; i++) { data.Add(new Employee { Id = i, ParentId = null, Name = $"root: {i}" }); for (int j = 2; j < 5; j++) { int currId = i * 100 + j; data.Add(new Employee { Id = currId, ParentId = i, Name = $"first level child of {i}" }); for (int k = 3; k < 5; k++) { data.Add(new Employee { Id = currId * 1000 + k, ParentId = currId, Name = $"second level child of {i} and {currId}" }); ; } } } return await Task.FromResult(data); } } 属性中的变量绑定这些属性的值
@code {}部分。方法将页索引绑定到变量@bind-Page = " @MyPageIndexVariable "语法。
下面是实现将所有记录放在一个页面上的页面大小选择的一种方法。
将Page Size绑定到一个变量
动态页面大小更改 @code {int PageSize {get;设置;} = 10;void ChangePageSize(ChangeEventArgs e) {if (e.v evalue . tostring ().ToLowerInvariant() == "all") {PageSize = Data.Count();} else {PageSize = int.Parse(e.Value.ToString());}} public List Data {get;设置;} protected override async任务OnInitializedAsync(){数据=等待GetTreeListData(); } // sample models and data generation public class Employee { public int Id { get; set; } public int? ParentId { get; set; } public string Name { get; set; } } async Task> GetTreeListData() { List data = new List(); for (int i = 1; i < 15; i++) { data.Add(new Employee { Id = i, ParentId = null, Name = $"root: {i}" }); for (int j = 2; j < 5; j++) { int currId = i * 100 + j; data.Add(new Employee { Id = currId, ParentId = i, Name = $"first level child of {i}" }); for (int k = 3; k < 5; k++) { data.Add(new Employee { Id = currId * 1000 + k, ParentId = currId, Name = $"second level child of {i} and {currId}" }); ; } } } return await Task.FromResult(data); } } 事件
TreeList公开了几个相关事件。你可以在事件篇文章。
PageChanged-你可以使用它来响应用户更改页面。PageSizeChanged-当用户通过页导航下拉列表改变页面大小时触发。
寻呼机设置
除了页面而且页大小时，TreeList提供了高级的寻呼机配置选项TreeListPagerSettings标记，该标记嵌套在其中TreeListSettings。这些配置属性包括:
| 属性 | 类型及默认值 | 描述 |
|---|---|---|
自适应 |
保龄球（ 真正的） |
分页器元素是否应根据屏幕大小更改。启用时，寻呼机将隐藏其寻呼机信息而且页大小,它如果他们装不下可用的空间。在最小分辨率下，页面按钮将呈现为选择元素。 |
ButtonCount |
int（10） |
将可见的页面按钮的最大数量。为了生效，ButtonCount必须小于页数(ButtonCount < Total / PageSize）. |
InputType |
PagerInputType（ 按钮） |
寻呼机是显示转到特定页面的数字按钮，还是显示输入页面索引的文本框。箭头按钮总是可见的。的PagerInputTypeEnum接受值按钮或输入。当输入，则当文本框模糊或用户按回车键时，页面索引将会改变。这是为了避免无意的数据请求。 |
页大小 |
列表< int ?> |
允许用户通过下拉列表更改页面大小。属性配置下拉列表选项。一个零项目页大小列表将显示“All”选项。缺省情况下，不显示寻呼机下拉列表。你也可以设置页大小来零以编程方式删除下拉列表在任何时候。 |
位置 |
PagerPosition枚举（ PagerPosition。底） |
寻呼机的位置。可用的选项有前而且底。 |
@*配置页机设置*@ @code { public List Data { get; set; } int PageSize { get; set; } = 15; int CurrentPage { get; set; } = 3; protected List PageSizes { get; set; } = new List { 15, 30, null }; protected override async Task OnInitializedAsync() { Data = await GetTreeListData(); } // sample models and data generation public class Employee { public int Id { get; set; } public int? ParentId { get; set; } public string Name { get; set; } } async Task> GetTreeListData() { List data = new List(); for (int i = 1; i < 15; i++) { data.Add(new Employee { Id = i, ParentId = null, Name = $"root: {i}" }); for (int j = 2; j < 5; j++) { int currId = i * 100 + j; data.Add(new Employee { Id = currId, ParentId = i, Name = $"first level child of {i}" }); for (int k = 3; k < 5; k++) { data.Add(new Employee { Id = currId * 1000 + k, ParentId = currId, Name = $"second level child of {i} and {currId}" }); ; } } } return await Task.FromResult(data); } }