elementUI全屏loading的使用(白屏的解决方案)

官网中有使用方法,但是我实际上手之后会出现白屏,解决办法如下:

javascript 复制代码
    <el-button type="text" size="small" @click="delRow(scope)">    
        删除
    </el-button>



      loading: false, // loading 动画
      loadingInstance: null,



  delRow(row) {
      this.loading = true;
      this.$nextTick(() => {
        const target = document.querySelector(".el-dialog__body");
        let options = {
          lock: true,
          text: "重新绘制中...",
          spinner: "el-icon-loading",
          background: "rgba(0, 0, 0, 0.7)",
        };
        this.loadingInstance = this.$loading(options, target);
      });
      setTimeout(() => {
        this.loading = false;
        this.loadingInstance.close();

        // 业务代码 ...
      }, 500);
    },
相关推荐
清云随笔几秒前
axios 实现 无感刷新方案
前端
鑫宝Code2 分钟前
【React】状态管理之Redux
前端·react.js·前端框架
忠实米线10 分钟前
使用pdf-lib.js实现pdf添加自定义水印功能
前端·javascript·pdf
pink大呲花13 分钟前
关于番外篇-CSS3新增特性
前端·css·css3
少年维持着烦恼.17 分钟前
第八章习题
前端·css·html
我是哈哈hh20 分钟前
HTML5和CSS3的进阶_HTML5和CSS3的新增特性
开发语言·前端·css·html·css3·html5·web
田本初37 分钟前
如何修改npm包
前端·npm·node.js
明辉光焱1 小时前
[Electron]总结:如何创建Electron+Element Plus的项目
前端·javascript·electron
牧码岛1 小时前
Web前端之汉字排序、sort与localeCompare的介绍、编码顺序与字典顺序的区别
前端·javascript·web·web前端