Maui Blazor 中文社区 QQ群:645660665

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

通知组件

通过浏览器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
通知触发时要播放的音频文件的 URL
string
OnClick
通知点击后的回调方法名称
Methods

Blazor Bootstrap 组件库文档

https://www.blazor.zone

写在最后

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

star流程:

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

  https://gitee.com/LongbowEnterprise/BootstrapBlazor

2、点击star,如下图,即可完成star,关注项目不迷路:
  
  

另外还有两个GVP项目,大佬们方便的话也点下star呗,非常感谢:

  BootstrapAdmin 项目地址:

  https://gitee.com/LongbowEnterprise/BootstrapAdmin

  SliderCaptcha 项目地址:

  https://gitee.com/LongbowEnterprise/SliderCaptcha

交流群(QQ)欢迎加群讨论

   BA & Blazor ①(795206915)        BA & Blazor ②(675147445)

posted @   AlexChow  阅读(490)  评论(0编辑  收藏  举报
相关博文:
阅读排行:
· 一个费力不讨好的项目,让我损失了近一半的绩效!
· 清华大学推出第四讲使用 DeepSeek + DeepResearch 让科研像聊天一样简单!
· 实操Deepseek接入个人知识库
· CSnakes vs Python.NET:高效嵌入与灵活互通的跨语言方案对比
· 易语言 —— 开山篇
点击右上角即可分享
微信分享提示