創(chuàng)建:\src\utils\messageBox.js
/**
* elementUI messageBox 方法封裝
*/
import {MessageBox} from "element-ui";
//確認彈窗
/*
使用:
handleConfirm('確定執(zhí)行此操作嗎?', 'warning' , '標(biāo)題').then(res => {
// do something
}).catch(err => {
// do something cancel
});
*/
let handleConfirm = (text = '確定執(zhí)行此操作嗎?', type = 'warning' , title= '提示') => {
return MessageBox.confirm(text, title, {
confirmButtonText: '確定',
cancelButtonText: '取消',
type: type,
center: true
})
};
//alert彈窗
/*
使用:
handleAlert('提交數(shù)據(jù)成功!', 'success')
.then(res => {
// then() 可省略
})
*/
let handleAlert = (text = '操作成功。', type = 'success') => {
return MessageBox.confirm(`<span style="font-size: 1.2rem;margin-top: -1rem;margin-bottom: 0.4rem;display: block;">${text}</span>`, {
confirmButtonText: '關(guān)閉',
cancelButtonText: '',
showCancelButton:false,
dangerouslyUseHTMLString:true,
type: type,
center: true
})
};
export {handleConfirm,handleAlert}
組件中使用:
import {handleConfirm,handleAlert} from "@/utils/messageBox" ;
//確認彈窗
handleConfirm('確定執(zhí)行此操作嗎?', 'warning' , '標(biāo)題').then(res => {
// do something
}).catch(err => {
// do something cancel
});
//alert彈窗
handleAlert('提交數(shù)據(jù)成功!', 'success')
.then(res => {
// then() 可省略
})