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
}