使用async await改装MessageBox弹框

_菜鸟果果

已于 2022-07-25 14:09:36 修改

阅读量712

点赞数 1

文章标签： html5 css3 es6 javascript

于 2022-07-04 14:18:32 首次发布

本文链接：https://blog.csdn.net/qq_66390045/article/details/125597173

版权

本文介绍如何对 Element UI 中的删除确认对话框进行优化，包括使用 async/await 改进原有代码，增强代码的可读性和维护性。通过具体示例展示了如何处理用户的确认与取消操作，并给出相应的反馈。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

element原始版

      open() {
        this.$confirm('此操作将永久删除该文件, 是否继续?', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(() => {
          this.$message({
            type: 'success',
            message: '删除成功!'
          });
        }).catch(() => {
          this.$message({
            type: 'info',
            message: '已取消删除'
          });          
        });
      }

改装后

     async delDep(id) {
        const res = await this.$confirm('此操作将永久删除该文件, 是否继续?', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).catch((err)=>err)
        if(res === 'confirm') {
         await this.del(id)
         this.getInfo()
         this.$message({
            type: 'success',
            message: '删除成功!'
         })
       }
     }