js提示库Toastify介绍

今天升级一个em插件，之前提示是用alert函数搞的，只能说奇丑无比，于是问豆包有啥轻量好用的js提示库，豆包向我推荐了Toastify。

官网地址：https://apvarun.github.io/toastify-js/

最简单的用法例子：

<link rel="stylesheet" type="text/css" href="toastify.css">
<script src="toastify.js"></script>

<script>
  Toastify({
    text: '你好Toastify'
  }).showToast(); 
</script>

只需要设置text属性即可，也就是显示的内容，默认是在浏览器右上角，另外，还有很多配置项，直接列出来注释

Toastify({
  text: "This is a toast", // 显示内容
  duration: 3000, // 提示持续时间，默认3s
  destination: "https://github.com/apvarun/toastify-js", // 点击提示会跳转到哪里
  newWindow: true, // 点击提示是否新窗口打开
  close: true, // 是否显示关闭按钮
  gravity: "top", // `top` or `bottom` // 提示上下位置
  position: "left", // `left`, `center` or `right` // 提示左右位置
  stopOnFocus: true, // Prevents dismissing of toast on hover // 鼠标移动到提示上时，提示不关闭？
  style: { // 自定义提示样式，css
    background: "linear-gradient(to right, #00b09b, #96c93d)",
  },
  onClick: function(){} // 点击提示时触发
}).showToast();