electron 学习笔记(四)—— 系统通知

系列文章目录

第一章 基础知识点
第二章 electron-vue
第三章 自定义标题栏
第四章 系统通知


文章目录

  • 系列文章目录
  • 系统通知
  • 一、在渲染进程中实现
  • 二、在主进程中实现


系统通知

目的是让用户第一时间接收提示信息,提醒用户某种行为~
效果如下:
electron 学习笔记(四)—— 系统通知_第1张图片
electron 学习笔记(四)—— 系统通知_第2张图片


一、在渲染进程中实现

Electron允许开发者使用 HTML5 Notification API 发送通知,并使用当前运行的操作系统的本地通知 API 来显示它。

 let n = new Notification('hello', {
    body: 'Have a good day~'
 })
 setTimeout(function() {
    n.close();
}, 3000);

兼容性:
移动端兼容性较差,PC浏览器大多支持~

二、在主进程中实现

代码如下(示例):

// 从主进程中引入Notification类
const { Notification } = remote

// 检查是否支持,Notification.isSupported()
if (Notification.isSupported()) {
    let notification = new Notification({
      title: '',
      body: 'Have a good day~'
    })
    notification.show()
}

实例调用notification.show()方法才会显示出通知


你可能感兴趣的:(electron,js,前端,html5)