MessageBox 弹框确定延时

最新推荐文章于 2024-07-18 15:48:23 发布

一只很酸de橘子

最新推荐文章于 2024-07-18 15:48:23 发布

阅读量240

点赞数 1

文章标签：前端 linux javascript

本文链接：https://blog.csdn.net/wxx_0124/article/details/140040320

版权

异常描述： MessageBox 弹框确定和取消执行不同操作时，完全加载需要一些时间，如果点击确定过快，可能导致执行错误的操作，可通过设置延时解决

以下设置只能点击确定和取消，没有关闭按钮，Esc健无效，点击空白处无效

方案一：
open() {
this.$confirm('此操作将永久删除该文件, 是否继续?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        showClose: false,
        showCancelButton: true,
        closeOnClickModal: false,
        closeOnPressEscape: false,
        type: 'warning',
        confirmButtonLoading: false,
        beforeClose: (action, instance, done) => {
          if (action === 'confirm') {
            instance.confirmButtonLoading = true;
            // instance.confirmButtonText = '执行中...';
            setTimeout(() => {
              this.$message({
                type: 'success',
                message: '确定!'
              });
              done();
              setTimeout(() => {
                instance.confirmButtonLoading = false;
              }, 300);
            }, 3000);
          } else {
            this.$message({
              type: 'info',
              message: '取消!'
            });
            done();
          }
        }
      })
    }


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

本来想使用方案二，设置确定按钮延时加载，没搞成，欢迎大神指导。