时间戳

首页 > 解决方案 > Blazor 服务器组件在状态更改后不刷新

c# - Blazor 服务器组件在状态更改后不刷新

问题描述

我正在根据一些 ifs 在另一个组件中渲染一个组件，逻辑是有客户端并且它们有链接的客户端，如果有任何链接的客户端，则显示一个下拉列表，如果用户从下拉列表中选择任何链接的客户端，链接的客户端数据将在同一组件中并排显示。

但问题是它在我选择链接客户端时第一次工作，如果我选择另一个，组件不会刷新，如果我将其更改为 0，那么它会再次刷新并只显示客户端数据，然后如果我再次从 0 更改它再次工作。

下面是我的代码。


@if (LinkedClients?.Count() > 0)
{
    <select class="form-control input-width-auto bg-white" @onchange="e => ChangeLinkedClient(e)">
        <option value="0">Select Linked Account</option>
        @foreach (var item in LinkedClients)
        {
            <option value="@item.LinkedClient.Id">@item.LinkedClient.Name</option>
        }
    </select>
}
<div class="row mt-3">
    <div class="@((SelectedLinkedClient != 0)? "col-md-6" : "col-md-12")">
                

<MyProject.ComponentLibrary.Profile.ProfilePrimaryDetailsComponent ClientId="ClientId" GoToNextEvent="GoToNext" LoadProfileProgress="DoNothing"></MyProject.ComponentLibrary.Profile.ProfilePrimaryDetailsComponent>
            </div>
                <div class="col-md-6">
                    @if (SelectedLinkedClient != 0)
                    {
                    

<MyProject.ComponentLibrary.Profile.ProfilePrimaryDetailsComponent ClientId="SelectedLinkedClient" GoToNextEvent="GoToNext" LoadProfileProgress="DoNothing"></MyProject.ComponentLibrary.Profile.ProfilePrimaryDetailsComponent>
                    }
                </div>
            </div>

更改方法代码

public void ChangeLinkedClient(Microsoft.AspNetCore.Components.ChangeEventArgs e)
    {
        SelectedLinkedClient = Convert.ToInt32(e.Value.ToString());
        StateHasChanged();
    }

我在视图内的 MVC Core 项目中呈现此组件。

标签： c#asp.netblazorblazor-server-side

解决方案

使用@key 控制元素和组件的保存：

<option value="@item.LinkedClient.Id" @key="@item">@item.LinkedClient.Name</option>

您还可以使用@key 在对象未更改时保留元素或组件子树

推荐阅读