如何在 Blazor 中删除和排序动态创建的 RenderFragments

Question

我无法在 Blazor 中正确删除或排序动态创建的组件。

我在我的页面正文中创建我的对象如下：

private RenderFragment CreateComponentObject() => builder =>
    {
        foreach (var item in myObjects)
        {
             builder.OpenComponent(i, typeof(MyBlazorComponent));
                    builder.AddAttribute(1, "ComponentID", item.ID);
                    builder.AddAttribute(1, "ComponentName", item.Name);
                    builder.AddComponentReferenceCapture(i, inst => { ReferenceObjects.Add((MyBlazorComponent)inst); });
                    builder.CloseComponent();

        }
        i++;
};

现在我需要两者都能够

1. Sort the components by ID or Name
2. Eventually remove one or more components

我尝试通过简单的排序脚本对项目进行排序，但它不起作用。或者，我尝试通过 builder.Clean“删除”所有组件，然后重新进入 CreateComponentObject 函数，命令以所需方式创建组件。但这种策略效果不佳，因为某些参数的顺序会发生变化，而其他参数则不会。

示例：如果我清除构建器并按名称重新分配组件，我将看到组件的 ID 按照正确的顺序排列，但名称不会改变

Before:
ID 19 Name Kiki
ID 20  Name Jiji

After:
ID 20 Name Kiki
ID 19 Name Jiji

有没有人知道如何面对我的两个问题？

Answer 1

编号应该follow linenumbers, not for loops.

 builder.OpenComponent(1, typeof(MyBlazorComponent));
        builder.AddAttribute(2, "ComponentID", item.ID);
        builder.AddAttribute(3, "ComponentName", item.Name);
        builder.AddComponentReferenceCapture(4, inst => { ReferenceObjects.Add((MyBlazorComponent)inst); });
        builder.SetKey(item);     // makes the sequence nrs less relevant
        builder.CloseComponent();

// i++;

但您可能想使用 SetKey 覆盖编号。

如何在 Blazor 中删除和排序动态创建的 RenderFragments

How to remove and sort dynamically created RenderFragments in Blazor

javascript

sorting

render

blazor