Server-side Blazor中Radzen PickList按CompanyId/TypeId过滤无数据问题

问题描述 #

开发Server-side Blazor项目时，使用RadzenPickList组件展示People表数据，期望按CompanyId和TypeId过滤后再显示。未添加过滤条件时数据正常展示，添加过滤后无数据显示。后续发现selectedCompany默认值为0，且选择新的selectedCompany和selectedPeopleType后，过滤逻辑未更新，导致始终无法获取匹配数据。

问题根源 #

1. 初始值不匹配：selectedCompany默认值为0，若数据库People表中无CompanyId=0的记录，初始过滤后自然无数据。
2. 缺少值变更触发机制：selectedCompany或selectedPeopleType变化时，未重新执行过滤逻辑并更新Source集合，UI也不会自动刷新。
3. 组件配置错误：RadzenPickList的TextProperty设置为@nameof(ClassMembers.Name)，但实际绑定的是People类型集合，配置不符；RadzenRequiredValidator的Component属性指向selectedClassType，但代码中无该变量，属于笔误。

修复步骤 #

1. 修正初始值与过滤逻辑 #

将selectedCompany改为可空类型，适配数据库无默认0值的场景，并调整过滤逻辑处理空值：

// 改为可空类型，避免默认0值导致无匹配数据
private int? selectedCompany;
private int selectedPeopleType = 1;

更新过滤逻辑：

private void RefreshSource()
{
    Source = Peoples.Where(pl => 
        (selectedCompany == null || pl.CompanyId == selectedCompany) 
        && pl.TypeId == selectedPeopleType
    ).ToList();
}

2. 添加值变更触发刷新的控件与逻辑 #

添加用于选择Company和PeopleType的下拉控件，并在值变更时触发过滤刷新：

<!-- 公司选择控件 -->
<RadzenFormField Text="Company">
    <ChildContent>
        <RadzenDropDown @bind-Value="selectedCompany" 
                        Data="@Companies" 
                        TextProperty="Name" 
                        ValueProperty="Id" 
                        Placeholder="选择公司" />
    </ChildContent>
    <Helper>
        <RadzenRequiredValidator Component="selectedCompany" Text="请选择公司" />
    </Helper>
</RadzenFormField>

<!-- 人员类型选择控件 -->
<RadzenFormField Text="人员类型">
    <ChildContent>
        <RadzenDropDown @bind-Value="selectedPeopleType" 
                        Data="@PeopleTypes" 
                        TextProperty="TypeName" 
                        ValueProperty="Id" 
                        Placeholder="选择类型" />
    </ChildContent>
</RadzenFormField>

在代码中给绑定变量添加setter触发刷新：

private int? _selectedCompany;
private int? selectedCompany
{
    get => _selectedCompany;
    set
    {
        if (_selectedCompany != value)
        {
            _selectedCompany = value;
            RefreshSource();
            StateHasChanged();
        }
    }
}

private int _selectedPeopleType = 1;
private int selectedPeopleType
{
    get => _selectedPeopleType;
    set
    {
        if (_selectedPeopleType != value)
        {
            _selectedPeopleType = value;
            RefreshSource();
            StateHasChanged();
        }
    }
}

3. 修正RadzenPickList配置错误 #

将TextProperty改为正确的People.Name：

<RadzenPickList @bind-Source="@Source" @bind-Target="@Target" Style="height:300px; width:100%;" Orientation="Orientation.Horizontal"
                TextProperty="@nameof(People.Name)" AllowFiltering="true" Multiple="true" ShowHeader="true" Disabled="false"
                ButtonGap="12px" ButtonJustifyContent="JustifyContent.Center" ButtonStyle="ButtonStyle.Secondary" ButtonSize="ButtonSize.Medium"
                ButtonShade="Shade.Default" ButtonVariant="Variant.Flat">
    <SourceHeader>
        可选成员: 
    </SourceHeader>
    <TargetHeader>
        已选成员:
    </TargetHeader>
    <Template>
        @context.Name
    </Template>
</RadzenPickList>

4. 初始化时正确加载数据 #

在OnInitializedAsync中确保数据加载后调用刷新方法：

protected override async Task OnInitializedAsync()
{
    Peoples = await DbContext.People
        .Select(pl => new People
        {
            Id = pl.Id,
            Name = pl.Name,
            CompanyId = pl.CompanyId,
            TypeId = pl.TypeId
        }).ToListAsync() ?? new List<People>();
    
    // 初始化时执行一次过滤
    RefreshSource();

    await base.OnInitializedAsync();
}

内容的提问来源于stack exchange，提问作者eza