SweetAlert2 - 漂亮可定制的 JavaScript 弹窗

https://sweetalert2.github.io/
https://github.com/sweetalert2/sweetalert2
在这里插入图片描述

安装：

npm install sweetalert2

封装：

import Swal from 'sweetalert2/dist/sweetalert2.js'
import 'sweetalert2/src/sweetalert2.scss'/*** * @param {string} icon  - icon类型 success error warning info question* @param {string} title - 标题* @param {string} text  - 内容* * @param {boolean} showConfirmButton  - 是否开启确认按钮* @param {boolean} showCancelButton   - 是否开启取消按钮* @param {boolean} showDenyButton     - 是否开启拒绝按钮* @param {string} confirmButtonText   - 确认按钮文本* @param {string} cancelButtonText    - 取消按钮文本* @param {string} denyButtonText      - 拒绝按钮文本* @param {string} confirmButtonColor  - 确认按钮颜色* @param {string} cancelButtonColor   - 取消按钮颜色* @param {string} denyButtonColor     - 拒绝按钮颜色* * @param {string} imageUrl     - * @param {string} imageHeight  - * @param {string} imageAlt     - * * @param {number} timer        - 持续时间* @param {boolean} draggable   - 是否拖拽* @param {boolean} heightAuto  - 是否开启自动高度* * @return {Object}*/
export async function handleSwal({icon,title = '',text = '',// showConfirmButton = true,showCancelButton = true,showDenyButton = false,confirmButtonText = "确认",cancelButtonText = `取消`,denyButtonText = `拒绝`,confirmButtonColor,cancelButtonColor,denyButtonColor,// imageUrl,imageHeight,imageAlt,// // footer//timer,draggable = false,heightAuto = false
} = {}) {const res = await Swal.fire({icon: icon || 'question',title,text,// 按钮showConfirmButton,showCancelButton,showDenyButton,confirmButtonText,cancelButtonText,denyButtonText,confirmButtonColor,cancelButtonColor,denyButtonColor,// 图片内容imageUrl,imageHeight,imageAlt,// 底部内容// footer,// 配置timer, // 持续时间draggable, // 是否拖动heightAuto // 是否自动高度})return res
}