BootStrapBlazor中MultiSelect组件在表格中使用时存在的问题

最新推荐文章于 2024-10-12 12:29:47 发布

保温杯泡

最新推荐文章于 2024-10-12 12:29:47 发布

阅读量199

点赞数 2

文章标签：前端 javascript html

本文链接：https://blog.csdn.net/wjbych/article/details/140843932

版权

仅作记录，备以后回忆

在Table中使用了双击弹出编辑框来修改数据，正好逆变器需要多选，就使用了MultiSelect组件，结果发现它选择后没有任何效果，不会显示，但是保存后发现它是有数据的，网上搜了下，说是onblur失效。

那就先把多选器的值绑定到一个变量上吧（s_nbq），然后写OnSelectedItemsChanged事件，在此直接引用了https://www.cnblogs.com/ashlly/p/17954197此贴，

<div class="col-6 col-sm-6">
				<BootstrapInputGroup>
					<Button Color="Color.Success" IsDisabled="true" style="width:120px;">逆变器</Button>
					<MultiSelect Items="itemNBQ" OnSelectedItemsChanged="@PanelBlurred" Value="@s_nbq" ShowSearch="true" Max="2" />
				</BootstrapInputGroup>
</div>

private Task PanelBlurred(IEnumerable<SelectedItem> items)
{
	s_nbq = string.Join(",", items.Select(s => s.Value));
	return Task.CompletedTask;
}

private async Task DoubleClickRowCallback(DianZhan item)
{
	s_nbq = item.逆变器;
}

在双击行要弹出编辑窗口时，使用Table组件的行双击回调事件，把当前行的逆变器的值传给s_nbq，这样就实现了表格和编辑窗口中的逆变器值一致。最后的效果如下，很是完美丝滑。