前言
在前端开发过程中，用户体验是我们要考虑的重点。其中之一就是提示信息的体验，mini-toastr-o8 是一个轻量的 npm 包，可以快速的给我们的用户反馈信息，并且用户体验效果更佳。
安装
我们可以通过 npm 进行安装。
--- ------- -------------- ------
使用
在 index.html 中添加提示信息容器。
---- -----------------------
在 app.js 中导入 mini-toastr-o8。
------ ---------- ---- -----------------
mini-toastr-o8 可以由以下参数配置:
- types: 默认 ['error', 'warn', 'info', 'success']
- animation: 默认 ['slide', 'fading']
- timeout: 默认 3000ms
- sticky: 设置为 true 可以让提示信息一直存在，如需关闭则需要手动点击关闭。
在初始化时对 mini-toastr 进行配置。
-----------------
------ --------- ------- ------- ---------- ----------
---------- ---------
-------- -----
---我们可以自定义消息类型，实现方法如下。
-----------------
------ -
------ ---------
----- ---------
-------- ---------
----- ---------
------- -----------
-
---我们可以使用下列方法进行提示信息的展示。
1. miniToastr.error
-------------------------
2. miniToastr.warn
------------------------
3. miniToastr.success
---------------------------
4. miniToastr.info
------------------------
5. miniToastr.custom
---------------------------- -----------
示例代码
---- -----------------------
------ ---------- ---- -----------------
-----------------
------ -
------ ---------
----- ---------
-------- ---------
----- ---------
------- -----------
--
---------- ---------
-------- -----
---
-------------------------
------------------------
---------------------------
------------------------
---------------------------- -----------结语
如果你正在开发一个网站或应用程序，并需要各种类型的提示信息，那么 mini-toastr-o8 是一个非常好的选择。通过一些简单的配置，你可以轻松地将这个库集成到你的项目中，并增强你的用户体验。
来源：JavaScript中文网 ，转载请联系管理员！ 本文地址：https://www.javascriptcn.com/post/60065f79238a385564ab697e