vue封装提示框

在utils下,新建myconfirm.js文件

import { MessageBox,Message } from "element-ui";
//删除弹窗
export default function myconfirm(text){
    return new Promise((resolve, reject) => {
        MessageBox.confirm(text, '系统提示', {
            confirmButtonText: '确定',
            cancelButtonText: '取消',
            type: 'warning'
        }).then(() => {       //点击确定后的回调函数
            resolve(true)
        }).catch(() => {      //取消后的回调函数
            reject(false)
        })
        
    }).catch(()=>{
        
    })
        
}

使用时,在全局引入

用于删除提示  前面需要添加 await。

//删除
        async handleDelete(row){
            //首先判断部门下是否存在子菜单或用户
            let result = await departmentApi.checkDept({id:row.id});
            //判断是否能删除
            if(!result.success){
                //提示不能删除
                this.$message.warning(result.message);
            }else{
                //提示是否确认删除
                let confirm = await this.$myconfirm("确定删除数据么?");
                if(confirm){
                    //执行删除功能
                    let res = await departmentApi.deleteDept({id:row.id});
                    //判断是否成功
                    if(res.success){
                        this.$message.success(res.message);
                        this.search();
                    }else{
                        this.$message.error(res.message);
                    }
                }
            }
        },

你可能感兴趣的:(vue)