npm 包 appnotifyme 使用教程
在日常开发中，经常需要给用户发送 PC 端或移动端的通知信息，比如说接收邮件、收到新的朋友请求、收到即时聊天信息等等。而 appnotifyme 包是一个可以方便地实现浏览器端通知的 npm 包，本文就介绍如何使用该 npm 包来实现浏览器端的消息通知功能。
一、安装 appnotifyme
使用 npm 可以很方便地安装 appnotifyme：
--- ------- ----------- ------
二、使用 appnotifyme
在你的代码中引入 appnotifyme 包，代码如下：
--- ----------- - -----------------------
创建一个 Notification 对象，如下所示：
--- ------------ - ----------------- ------- - ----- ----- --------- ----- ----- ---- ---- ---
其中，标题通过第一个参数传递，内容和图片可以通过第二个参数配置。接下来，就可以使用 notification 对象来展示通知信息了：
--- ------------ - ------------------------------------- -------------------------------------- -------- -- - -------------------- ---
上述代码中，我们注册了一个按钮点击事件，当用户点击该按钮时，就会展示使用上述代码创建的 notification 对象。
三、appnotifyme 的配置参数
除了上述代码中的 body 和 icon 参数，还有很多其他的配置选项可以使用，这里列举一些比较常用的：
tag：标签字符串，用于区分多个通知对象。data：自定义的数据，可以在通知被用户点击时进行扩展。silent：布尔值，表示通知是否应该在用户接收到时播放声音。renotify：布尔值，表示是否要重新显示同一 tag 的通知。requireInteraction：布尔值，表示通知是否应该一直存在，直到被用户手动隐藏为止。actions：自定义操作数组，用于在通知中添加操作按钮。
四、示例代码
最后，我们来看一下完整的示例代码吧。该示例代码展示了如何创建一个开启声音提示的通知对象，并添加一个操作按钮。
--- ----------- - -----------------------
--- ------- - -
----- ------- ----
----- --------------------------------------------------------------------------
---- ------------
------ -------------------------------------------------------------------------------
------------------- -----
-------- -
-------- --------- ------ ------- ---- ------ ----- ---
-
--
--- ------------ - ---------------- ---------- ---------
--- ------------ - -------------------------------------
-------------------------------------- -------- -- -
--------------------
---通过这个例子，我们可以清楚地看到如何使用 appnotifyme 包来实现网页通知的功能，同时也可以学习到如何配置和控制通知的各种属性。希望这篇文章对前端开发者们有所帮助。
来源：JavaScript中文网 ，转载请联系管理员！ 本文地址：https://www.javascriptcn.com/post/60058b2681e8991b448ed3c7