element弹出toast提示窗口

组件封装：

如何封装一个toast提示窗口呢？
且如何优雅的调用后端接口数据？

---

import Vue from 'vue'
//toast提示框
export const confirm = async (msg, type = 'warning') => {
    
    
	return await Vue.prototype.$confirm(msg, '提示', {
    
    
	 confirmButtonText: '确定',
	 cancelButtonText: ,'取消',
	 type
   })
}

---

引入使用：

import confirm from '@util/common'

handleDel(index,row){
    
    
	confirm('删除后启用中的Banner将不再展示,是否要删除此条Banner? ')
		.then(() => {
    
    
			bannerAPI.fetcRremove(row.id).then(res => {
    
    
				if (res.code == 200) {
    
    
					this.fetchData() //数据刷新请求
					this.$message.success ('删除成功')
				} else {
    
    
					this.$message.error(res.msg)
				}
			})
		})
		.catch(() => {
    
    
			console.log('取消')
			this.fetchData()
		}）
	}，

---

效果如下：