Radzen Blazor 树形组件中处理重复键值的解决方案

问题背景

在使用 Radzen Blazor 组件库中的树形组件(RadzenTree)时，开发者可能会遇到一个常见的错误："More than one sibling of component 'Radzen.Blazor.RadzenTreeItem' has the same key value"。这个错误表明在树形结构中存在相同键值的兄弟节点，而 Blazor 框架要求每个组件的键值必须是唯一的。

错误分析

该错误通常发生在以下场景：

1. 开发者使用 POI(兴趣点)类作为数据源构建树形结构
2. POI 类包含 Id、Name、ParentId 等属性
3. 树形组件通过 ParentId 属性建立父子关系
4. 在构建树形结构时，同一个子节点可能被多次添加到父节点的 Children 集合中

解决方案

通过修改 BuildHierarchy 方法，可以有效地解决这个问题。核心思路是在添加子节点前检查该节点是否已经存在于父节点的子集合中：

private void BuildHierarchy()
{
    hierarchicalPois.Clear();
    var lookup = pois.ToDictionary(p => p.Id);

    foreach (var poi in pois)
    {
        if (poi.ParentId == null)
        {
            hierarchicalPois.Add(poi);
        }
        else if (lookup.TryGetValue(poi.ParentId.Value, out var parent))
        {
            parent.Children ??= new List<POI>();
            if (!parent.Children.Any(c => c.Id == poi.Id)) // 检查是否已存在
            {
                parent.Children.Add(poi);
            }
        }
    }
}

技术要点

1. 唯一性检查：通过 Any(c => c.Id == poi.Id) 确保不会重复添加相同的子节点
2. 空值合并赋值：使用 ??= 运算符确保 Children 集合被初始化
3. 字典查找优化：使用 ToDictionary 创建查找表提高父节点查找效率

最佳实践

1. 在构建树形结构时，始终确保每个节点的唯一性
2. 对于可能存在循环引用的情况，应添加额外的检查逻辑
3. 考虑使用不可变集合来避免意外的修改
4. 对于大型树结构，可以考虑使用更高效的查找方法

总结

处理 Radzen Blazor 树形组件中的重复键值问题，关键在于确保数据结构在渲染前的正确性。通过在构建层次结构时添加存在性检查，可以避免渲染时的键值冲突，同时保持应用的稳定性和性能。这种方法不仅适用于 POI 类，也可以推广到其他需要构建树形结构的场景中。