Blazor UI:区块/忙碌服务
UI区块功能可以禁用(锁定)整个页面或页面的某个部分。
快速示例
只需在页面或组件中 注入 IBlockUiService服务,然后调用 Block/UnBlock 方法即可禁用(锁定)元素。
namespace MyProject.Blazor.Pages
{
public partial class Index
{
private readonly IBlockUiService _blockUiService;
public Index(IBlockUiService blockUiService)
{
_blockUiService = blockUiService;
}
public async Task BlockForm()
{
/*
Block方法参数说明:
selectors: 包含一个或多个选择器匹配条件的字符串。参考:https://developer.mozilla.org/en-US/docs/Web/API/Document/querySelector#selectors
busy: 设置为true时会在被锁定区域显示进度指示器
*/
await _blockUiService.Block(selectors: "#MySelectors", busy: true);
}
}
}
实现后的UI效果如下:
之后您可以使用 _blockUiService.UnBlock() 来重新启用忙碌区域/页面。
抠丁客



