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

来源：互联网收集：自由互联发布时间：2022-05-30

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

通知组件

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

DEMO https://www.blazor.zone/notifications

小提示

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

使用 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通知触发时要播放的音频文件的 URLstring — — OnClick通知点击后的回调方法名称Methods — — Blazor Bootstrap 组件库文档

https://www.blazor.zone

写在最后

　　希望大佬们看到这篇文章，能给项目点个star支持下，感谢各位！

star流程：

1、访问点击项目链接：BootstrapBlazor