Blazor Bootstrap 组件库浏览器通知组件介绍

2022 年 4 月 16 日
筆記
.NET6, Blazor, Blazor组件, BootstrapBlazor

通知组件

通过浏览器API发送通知信息 , 桌面浏览器表现为右下角系统提示框弹出消息, 移动浏览器表现为弹窗或者到消息列表, blazor页面不在前台也可以通过本组件提醒用户.

小提示

注意: 出于安全考虑，当网页请求发送通知时，用户会被提示进行授权

使用 BrowserNotification 静态方法直接调用 Dispatch 方法

private NotificationItem Model { get; set; } = new NotificationItem();

private async Task Dispatch()
{
    Interop ??= new JSInterop<Notifications>(JSRuntime);
    await BrowserNotification.Dispatch(Interop, this, Model, nameof(ShowNotificationCallback));
}

[JSInvokable]
public void ShowNotificationCallback(bool result)
{
    // callback
    StateHasChanged();
}

通知类定义 NotificationItem

参数	说明	类型	可选值	默认值
Title	标题	string	—	—
Message	信息	string	—	—
Icon	图标	string	—	—
Silent	静默	bool	—	—
Sound	通知触发时要播放的音频文件的 URL	string	—	—
OnClick	通知点击后的回调方法名称	Methods	—	—