You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

Blazor中双下拉框过滤列表:品牌下拉框重复项问题求助

解决Blazor品牌下拉框重复及多级过滤问题

1. 去除品牌下拉框重复项并关联经销商过滤结果

品牌下拉框当前遍历全部车辆导致重复,需基于经销商过滤后的车辆列表提取唯一品牌:

修改品牌下拉框代码:

<MudSelect T="string" @bind-Value="selectedBrand" Label="Select Brand" Variant="Variant.Filled">
    @foreach (var brand in FilteredBrands)
    {
        <MudSelectItem Value="@brand">@brand</MudSelectItem>
    }
</MudSelect>

在@code块中添加计算属性,获取过滤后的唯一品牌:

// 基于经销商过滤后的列表,提取去重且非空的品牌,按名称排序
private IEnumerable<string> FilteredBrands => FilteredDealer
    .Select(car => car.Brand)
    .Where(brand => !string.IsNullOrEmpty(brand))
    .Distinct()
    .OrderBy(brand => brand);

2. 合并经销商与品牌的多级过滤逻辑

原来的两个独立过滤列表需要合并,实现先经销商过滤,再品牌过滤的叠加效果:

替换原有FilteredDealer和FilteredBrand,新增最终过滤列表:

private string selectedDealer;
private string selectedBrand;
private List<CarViewModel> car = new List<CarViewModel>();

// 合并双重过滤条件:经销商为空则跳过经销商过滤,品牌为空则跳过品牌过滤
private List<CarViewModel> FinalFilteredCars => car
    .Where(car => 
        (string.IsNullOrEmpty(selectedDealer) || car.Dealership == selectedDealer) &&
        (string.IsNullOrEmpty(selectedBrand) || car.Brand == selectedBrand)
    )
    .ToList();

// 保留原经销商过滤逻辑,用于更新品牌下拉框选项
private List<CarViewModel> FilteredDealer => string.IsNullOrEmpty(selectedDealer)
    ? car
    : car.Where(car => car.Dealership == selectedDealer).ToList();

3. 更新表格绑定

将MudTable的Items属性绑定到合并后的最终过滤列表:

<MudTable Items="FinalFilteredCars" Hover="true" Breakpoint="Breakpoint.Sm" Loading="@_loading" LoadingProgressColor="Color.Info">
    <HeaderContent>
        <MudTh>Dealership</MudTh>
        <MudTh>Brand</MudTh>
        <MudTh>Model</MudTh>
    </HeaderContent>
    <RowTemplate>
        <MudTd DataLabel="Dealership">@context.Dealership</MudTd>
        <MudTd DataLabel="Brand">@context.Brand</MudTd>
        <MudTd DataLabel="Model">@context.Model</MudTd>
    </RowTemplate>
</MudTable>

额外优化:使用双向绑定简化逻辑

经销商下拉框建议改用@bind-Value替代手动的Value和ValueChanged,自动触发状态更新:

<MudSelect T="string" @bind-Value="selectedDealer" Label="Select Dealership" Variant="Variant.Filled">
    @foreach (var item in dealership)
    {
        <MudSelectItem Value="@item.Id">@item.Dealership</MudSelectItem>
    }
</MudSelect>

这样修改后:

  • 品牌下拉框只会显示当前选中经销商下的唯一品牌,无重复
  • 表格会同时应用经销商和品牌的过滤条件
  • 切换经销商时,品牌下拉框会自动更新为对应经销商的品牌选项

内容的提问来源于stack exchange,提问作者sayef4

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.08.17 10:30:29