MudBlazor DataGrid全选功能异常:点击全选复选框无效果
MudBlazor DataGrid全选时SelectedItems被清空的问题解决
问题根源
你遇到的两次回调、最终选中项被清空的问题,核心原因是SelectedItems的绑定与组件内部状态不同步。当点击全选复选框时,组件先将所有项加入选中集合并触发第一次回调;但如果你的回调没有正确更新绑定的外部集合(比如直接重新赋值集合而非修改现有集合),或者没有使用双向绑定,组件会检测到外部状态和内部状态不匹配,进而触发第二次回调将集合清空以同步状态。
解决方案
方案1:使用双向绑定(推荐)
直接替换单向绑定为双向绑定,让组件自动处理状态同步,无需手动写SelectedItemsChanged回调:
<MudDataGrid @bind-SelectedItems="@selectedItems" ...> <Columns> <SelectColumn /> <!-- 其他列 --> </Columns> </MudDataGrid>
方案2:手动处理回调时正确更新集合
如果必须保留SelectedItemsChanged回调,不要直接给selectedItems重新赋值,而是修改现有集合的内容:
private HashSet<YourModel> selectedItems = new(); private void OnSelectedItemsChanged(HashSet<YourModel> items) { // 清空现有集合并添加新选中项 selectedItems.Clear(); selectedItems.UnionWith(items); // 禁止使用 selectedItems = items; 这会导致集合引用变化,组件无法同步 }
这样修改后,点击全选复选框时,组件内部状态和外部绑定的集合会保持一致,不会出现两次回调导致清空的问题。
内容的提问来源于stack exchange,提问作者LongNeckTimmy
相关产品推荐
相关产品推荐

