blazor 中的 ComponentReferenceCapture 更新

Kes*_*iam 5 c# blazor

在一个 blazor 示例中,我使用 RenderFragment 来动态更新元素并捕获每次更新的组件引用。在最初捕获元素时,它会正确捕获组件引用。当我更新一个组件时,它会保留旧的 componentReference。组件参考未正确更新。

Index.razor

@page "/"

<button @onclick="AddContent">1st Update</button>
<button @onclick="AddSecondContent">2nd Update</button>
<button @onclick="CheckContent">Check Update</button>
@DataContent

@code {
    RenderFragment DataContent { get; set; }
    List<Counter> CounterReference = new List<Counter>();
    void AddContent()
    {
        DataContent = (Microsoft.AspNetCore.Components.Rendering.RenderTreeBuilder builder) =>
        {
            int seq = 0;
            for(int i = 0; i < 3; i++)
            {
                builder.OpenComponent<Counter>(seq++);
                builder.AddComponentReferenceCapture(seq++, ins => { CounterReference.Add((Counter)ins); });
                builder.CloseComponent();
            }

        };
        InvokeAsync(StateHasChanged);
    }

    void AddSecondContent()
    {
        CounterReference.Clear();
        DataContent = (Microsoft.AspNetCore.Components.Rendering.RenderTreeBuilder builder) =>
        {
            int seq = 0;
            for (int i = 0; i < 2; i++)
            {
                builder.OpenComponent<Counter>(seq++);
                builder.AddComponentReferenceCapture(seq++, ins => { CounterReference.Add((Counter)ins); });
                builder.CloseComponent();
            }

        };
        InvokeAsync(StateHasChanged);
    }

    void CheckContent()
    {
        Console.WriteLine();
    }
}

Run Code Online (Sandbox Code Playgroud)

反剃刀

@page "/counter"

<h1>Counter</h1>

<p>Current count: @currentCount</p>

<button class="btn btn-primary" @onclick="IncrementCount">Click me</button>

@code {
    private int currentCount = 0;

    public void IncrementCount()
    {
        currentCount++;
    }
}
Run Code Online (Sandbox Code Playgroud)

在上面的示例中,我最初更新了DataContent,我得到CounterReference 的计数为 3。在此之后,我清除了一个 CounterReference 并更新了DataContent。在第二种情况下,我正在渲染 2 个在 DOM 中正确渲染的 Counter 组件。但是我得到CounterReference 的计数为 0。在第二次更新中,如果我没有清除CounterReference,我得到它的值为 3。这样它就保留了它以前的值。我期望这个值为 2。

我做错了什么?