TreeList -刷新数据

使用ObservableCollection最常见的原因是让组件(如网格、树视图、树列表、下拉列表)在更改集合时发生变化或做出反应。

当您希望像这样刷新组件数据源时，需要注意两个重要的框架行为——ObservableCollection实例何时触发事件，以及当组件不是可观察集合时如何刷新组件的数据。

在本文中:

• 重新绑定的方法
• 可观测的数据
• 新典藏参考

重新绑定的方法

方法可以刷新数据重新绑定方法．使用组件引用调用重新绑定在进行数据更改(例如添加、删除项)后，请使用该方法。这是必要的，以防你不使用可观测的数据或重置集合引用．调用重新绑定将强制组件重新处理可用数据以反映更新。

@*添加/删除项目并重新绑定树列表以响应该更改。* @ < TelerikButton OnClick = " @AddRootItem " >添加根项目结束时收集< / TelerikButton > < TelerikButton OnClick = " @RemoveItem >删除最后一项< / TelerikButton > < TelerikTreeList @ref =“@TreeListRef”数据=“@TreeListData IdField =“EmployeeId ParentIdField”=“ReportsTo”可分页= " true " > < TreeListColumns > < TreeListColumn字段=“FirstName”扩展= " true " / > < TreeListColumn字段= " EmployeeId " / > < / TreeListColumns > < / TelerikTreeList > @code{私人TelerikTreeList <员工> TreeListRef;private List TreeListData {get;设置;} private void AddRootItem() {var i = TreeListData。计数+ 1;TreeListData。添加(new Employee() { EmployeeId = i, ReportsTo = null, FirstName = "Employee " + i.ToString() }); TreeListRef.Rebind(); } private void RemoveItem() { if (TreeListData.Count > 0) { TreeListData.RemoveAt(TreeListData.IndexOf(TreeListData.Last())); } TreeListRef.Rebind(); } public class Employee { public int EmployeeId { get; set; } public string FirstName { get; set; } public int? ReportsTo { get; set; } } protected override void OnInitialized() { TreeListData = new List(); var rand = new Random(); int currentId = 1; for (int i = 1; i < 6; i++) { TreeListData.Add(new Employee() { EmployeeId = currentId, ReportsTo = null, FirstName = "Employee " + i.ToString() }); currentId++; } for (int i = 1; i < 6; i++) { for (int j = 0; j < 5; j++) { TreeListData.Add(new Employee() { EmployeeId = currentId, ReportsTo = i, FirstName = " Employee " + i + " : " + j.ToString() }); currentId++; } } } }

可观测的数据

数据定位组件可以从实时数据中受益——当数据源集合发生变化时，组件应该更新以反映该变化。Blazor套件的Telerik UI中的大多数数据绑定组件都实现了这样的功能。

当数据组件的集合，该集合实现INotifyCollectionChanged接口(如ObservableCollection)，则Telerik组件订阅其CollectionChanged事件要更新。这意味着添加项、删除项或清除集合都会更新组件阀门()，.Remove ()而且.Clear ()方法)。

可观察对象集合触发CollectionChanged事件仅当添加，删除而且清晰的方法被调用。当您更改其中一个元素的字段值时，它们不会触发它。

@*添加/删除项目，以查看树列表对更改的反应。*@ @using system . collesons . objectmodel 在集合末尾添加根项 删除最后一项        @code {privateObservableCollection TreeListData {get;设置;} private void AddRootItem() {var i = TreeListData。计数+ 1;TreeListData。添加(new Employee() { EmployeeId = i, ReportsTo = null, FirstName = "Employee " + i.ToString() }); } private void RemoveItem() { if (TreeListData.Count > 0) { TreeListData.RemoveAt(TreeListData.IndexOf(TreeListData.Last())); } } public class Employee { public int EmployeeId { get; set; } public string FirstName { get; set; } public int? ReportsTo { get; set; } } protected override void OnInitialized() { TreeListData = new ObservableCollection(); var rand = new Random(); int currentId = 1; for (int i = 1; i < 6; i++) { TreeListData.Add(new Employee() { EmployeeId = currentId, ReportsTo = null, FirstName = "Employee " + i.ToString() }); currentId++; } for (int i = 1; i < 6; i++) { for (int j = 0; j < 5; j++) { TreeListData.Add(new Employee() { EmployeeId = currentId, ReportsTo = i, FirstName = " Employee " + i + " : " + j.ToString() }); currentId++; } } } }

如果需要向集合添加/从集合中删除许多项，请考虑创建一个新集合并提供其对data参数的引用。因此，组件将只重新呈现一次(当数据集合引用被更改时)，而不是响应Add/Remove事件重新呈现多次。

新典藏参考

在Blazor中，框架将触发OnParametersSet事件(这是子组件如何对外部更改做出反应)，仅当它可以通过相应的参数(如数据为Telerik组件的数据源)。该检测工作原理如下:

• 对于基本类型(如数字、字符串)，当它们的值发生变化时就会发生这种情况。

• 对于复杂类型(如数据集合，如列表，或任何IEnumerable，以及特定于应用程序的模型/对象)，当对象引用发生变化时就会发生这种情况。

  因此，您通常需要创建一个新视图模型字段的引用(例如TreeViewData = new List(theUpdatedDataCollection);)当你想更新组件时。

@*添加/删除项目或更改集合，以查看Treelist如何对更改做出反应。*@ 在集合末尾添加根项 删除最后一项 清除数据 加载新数据       @code {private List TreeListData {get;设置;} private void AddRootItem() {var i = TreeListData。计数+ 10;TreeListData。添加(new Employee() { EmployeeId = i, ReportsTo = null, FirstName = "Employee " + i.ToString() }); TreeListData = new List(TreeListData); } private void RemoveItem() { if (TreeListData.Count > 0) { TreeListData.RemoveAt(TreeListData.IndexOf(TreeListData.Last())); TreeListData = new List(TreeListData); } } private void ClearData() { TreeListData.Clear(); TreeListData = new List(TreeListData); } private void LoadNewData() { var newData = new List(); var rand = new Random(); int currentId = 6; for (int i = 6; i < 11; i++) { newData.Add(new Employee() { EmployeeId = currentId, ReportsTo = null, FirstName = "Employee " + i.ToString() }); currentId++; } for (int i = 6; i < 11; i++) { for (int j = 12; j < 16; j++) { newData.Add(new Employee() { EmployeeId = currentId, ReportsTo = i, FirstName = " Employee " + i + " : " + j.ToString() }); currentId++; } } TreeListData = new List(newData); Console.WriteLine("New data collection loaded."); } public class Employee { public int EmployeeId { get; set; } public string FirstName { get; set; } public int? ReportsTo { get; set; } } protected override void OnInitialized() { TreeListData = new List(); var rand = new Random(); int currentId = 1; for (int i = 1; i < 6; i++) { TreeListData.Add(new Employee() { EmployeeId = currentId, ReportsTo = null, FirstName = "Employee " + i.ToString() }); currentId++; } for (int i = 1; i < 6; i++) { for (int j = 0; j < 5; j++) { TreeListData.Add(new Employee() { EmployeeId = currentId, ReportsTo = i, FirstName = " Employee " + i + " : " + j.ToString() }); currentId++; } } } }

另请参阅

• ObservableCollection
• INotifyCollectionChanged接口
• 现场演示