开始是想着用参数来写的，但是写到一半发现有局限性，不能构建复杂点，就用option对象来代替了。

虽然从结果看起来像是脱了裤子放屁，但是我上次写的项目里有delete操作，

所以不得不经常使用elementui的确认弹框 this.$confirm。

然后我发现这个鬼东西居然不能用async来搞，虽然可以用async定义then的回调函数...

每次写一个弹框都要搞一大堆重复的东西，烦死了。

现在就有了这个东东。

import Vue from "vue"
import {
   	MessageBox,
   	Message
} from 'element-ui';
//import 'element-ui/lib/theme-chalk/index.css'; 
// 默认主题 如果不是全局引入样式就在这里取消样式的注释吧
const _toString = (value, type) => {
    //整的一个类型判断函数。value：“参数”，type：“string”||“String”
   	type = type.charAt(0).toUpperCase() + type.slice(1);
   	return Object.prototype.toString.call(value) == `[object ${type}]`;
}
export const $_Confirm = (option) => {
   	/*
该文件封装的是 elementui 的确认框，使用前请先下载elementui依赖
封装规则
主要是等待，
要有等待时间waitTimes和等待函数waitFunc才会开始等待，跳过then需要有了前两者且设置notThen为true才能跳过。
有了跳过可以不用设置thenFunc了，因为没有用。
        
如果需要render设置html，请在使用函数的时候使用 vue 的 render
let h = this.$createElement;
然后把 content 的内容设置成h()函数设置的内容。
content: h('p', null, [h('span', null, '内容可以是 '), h('i', { style: 'color: teal' }, 'VNode')]),
得到的就是render函数渲染的内容了。
   	*/
   	/* 	示例
//	let h = this.$createElement
$_Confirm({
title:"提示",
content:"<strong>这是 <i>HTML</i> 片段</strong>",
//content: h('p', null, [h('span', null, '内容可以是 '), h('i', { style: 'color: teal' }, 'VNode')]),
toHtml:true,
type:"warning",
waitTimes:3000,
waitFunc:()=>{
console.log('确认前的等待');
},
notThen:true,//是否取消不用then
thenFunc:()=>{
console.log('axios请求');
},
catchFunc:()=>{
console.log('axios请求取消');
},
cancels:["按键跳过","关闭跳过"]
});
*/
//不把 beforeClose 提取出来的话，没有设置wait的时候会有无法进入then的问题
let beforeClose = null;
if(_toString(option.waitTimes,"number")&&_toString(option.waitFunc,"function")&&option.waitTimes>=1000&&option.waitTimes<=5000) {
   	//只有设置了等待时间，等待函数且等待时间>=1000&&<=5000才会进来
   	beforeClose = (action, instance, done) => {
   	if (action === 'confirm') {
   	instance.confirmButtonLoading = true;
   	instance.confirmButtonText = '执行中...';
   	// console.log("没有到计时器")
   	option.waitFunc()
   	setTimeout(() => {
   	done();
   	// console.log("外层")
   	setTimeout(() => {
   	// console.log("内层")
   	instance.confirmButtonLoading = false;
   	}, 300);
   	}, option.waitTimes);
   	} else {
   	done();
   	}
   	};
   	}
   	MessageBox.confirm(option.content, option.title, {//
   	confirmButtonText: '确定',
   	cancelButtonText: '取消',
   	type: option.type || 'warning',
   	dangerouslyUseHTMLString: option.toHtml || false,//是否把内容渲染成html
   	distinguishCancelAndClose: true,//区分按钮关闭还是点击蒙层或ESC按钮关闭
   	beforeClose:beforeClose,//等待
   	}).then(() => {
   	//要notThen为true时，thenFunc没有设置，等待函数不为null才能跳过thenFunc
   	if(option.notThen===true&&!!option.thenFunc!=true&&!!beforeClose) return;
   	if (!!option.thenFunc) {
   	option.thenFunc()
   	} else {
   	Message.success("确定")
   	}
   	}).catch((action) => {
   	if(action === 'cancel'){
   	if (!!option.catchFunc) {
   	option.catchFunc()
   	} else {
   	Message.info(option.cancels[0]||"按键取消")
   	}
   	} else {
   	Message.info(option.cancels[1]||"关闭取消")
   	}
   	});
}

复制过来的样式有问题，要用的话自己创建js文件然后用编译器格式化代码吧。

2021/1/25 16:10:00

更新一件事。。。如果要在这里面使用async最好在thenFunc的时候给

$_Confirm({
	title:"提示",
	content:"确定删除吗！",
	type:"warning",
	thenFunc: async ()=>{
	    let params = {gameID: id};
	    let {code,body} = await Api.delete(params);
	    console.log(code,body)
	},
});