BootstrapBlazor组件库,Table组件外部刷新数据
BootstrapBlazor组件库,Table组件外部刷新数据
问题描述
有很多小伙伴在使用BootstrapBlazor
组件库的Table
组件时,经常会遇到外部调用OnQueryAsync
的需求。
解决方案
我们可以使用@ref
指令,将当前Table
对象引用到一个变量上面。
Razor代码
注意
@ref
指令要写@
符号
<Button @onclick="Query" Text="查询数据" IsAsync="true" />
<Table @ref=@TestTable TItem="DataList" OnQueryAsync="@OnQueryAsync">
<TableColumns>
<TableColumn @bind-Field="@context.日期" />
<TableColumn @bind-Field="@context.编号" />
<TableColumn @bind-Field="@context.等级" />
<TableColumn @bind-Field="@context.规格" />
</TableColumns>
</Table>
C#代码
注意
<>
内的类型和TItem
一致
private Table<DataList>? TestTable;
private async Task Query()
{
//通过下面的代码在外部调用Table的QueryAsync刷新数据。
await TestTable.QueryAsync();
}
private async Task<QueryData<DataList>> OnQueryAsync(QueryPageOptions options)
{
var Items = await tz.GetDatasAsync(Options);
return new QueryData<DataList>()
{
Items = Items
};
}
注意事项
Table
组件的Items
和OnQueryAsync
只能二选一,不能混用!本方案仅适合OnQuery
模式,Items
模式请调用StateHasChanged
。
分类:
Blazor
标签:
blazor
, BootstrapBlazor
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】凌霞软件回馈社区,博客园 & 1Panel & Halo 联合会员上线
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】博客园社区专享云产品让利特惠,阿里云新客6.5折上折
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· 微软正式发布.NET 10 Preview 1:开启下一代开发框架新篇章
· 没有源码,如何修改代码逻辑?
· PowerShell开发游戏 · 打蜜蜂
· 在鹅厂做java开发是什么体验
· WPF到Web的无缝过渡:英雄联盟客户端的OpenSilver迁移实战