在 Web 前端开发中，我们经常需要在页面上弹出多个提示信息，如错误提示、成功提示、警告提示等等。而 vue-multiple-message 就是一款方便快捷地实现此类需求的 npm 包。
安装
你可以通过 npm 进行安装，命令如下：
--- ------- -------------------- ------
使用
在你的 Vue 项目中，引入 vue-multiple-message：
------ ------------------ ---- ---------------------- ---------------------------
这样 vue-multiple-message 就已经成功引入了！
API
vue-multiple-message 提供了一些方法，以下是它们的介绍：
$message
$message 方法用于在页面上展示提示信息，包括错误提示、成功提示、警告提示等。
--------------- ----- -------- -- -- ---- ----- ---------------------------------- ------ -------- ------------ -- ------- ------------ --------- ---- -- -------- ------------------- --
此外，你可以通过修改 vueMultipleMessage.options 来全局配置 message 的默认参数：
-- ------------------------- - - -------------------------- - - ----- ------- --------- ---- -
$message.closeAll
$message.closeAll 方法用于关闭所有正在展示的提示信息。
------------------------
$message.setStyle
$message.setStyle 方法用于手动修改某一提示信息的样式。
----- ------- - --------------- -------- ------ ------- -- ------------------ ----------- ------ ------ ------- --
示例代码
下面是一个基于 vue-multiple-message 的示例代码，它能够在页面上自动弹出一个计时器，倒计时结束后弹出一条提示信息：
----------
-----
------------- ----------
----- --------- ------
------
-----------
--------
------ ------- -
------ -
------ -
---------- --
-
--
--------- -
----- ----- - -------------- -- -
-- --------------- - -- -
----------------
- ---- -
--------------------
---------------
----- ----------
-------- ----- ----
--
-
-- -----
-
-
---------通过这个例子，你可以更好地理解 vue-multiple-message 的使用方法。
来源：JavaScript中文网 ，转载请联系管理员！ 本文地址：https://www.javascriptcn.com/post/600562b381e8991b448dff27