【VUE】加载提示遮罩

在向后端请求数据或向后端发送数据时，为防止用户在此期间乱操作，所以在页面添加一个加载提示的遮罩，防止用户乱操作。

相关代码： 

          let loading = this.$loading({
            lock: true, // 显示/隐藏--默认为false
            text: "加载中，请稍候...", //显示在加载图标下方的加载文案
            background: "rgba(0,0,0,0.8)", //遮罩层颜色
            spinner: "el-icon-loading", //自定义加载图标类名
          });

loading.close();

使用方法：

在请求接口的位置，添加代码，接口请求成功，返回200后，调用关闭遮罩的方法。

    confirm() {
          let loading = this.$loading({
            lock: true, //lock的修改符--默认是false
            text: "加载中，请稍候...", //显示在加载图标下方的加载文案
            background: "rgba(0,0,0,0.8)", //遮罩层颜色
            spinner: "el-icon-loading", //自定义加载图标类名
          });
          const data = this.xxxData;
          getList(data).then((response) => {
            if (response.code == 200) {
              loading.close();  //成功后关闭遮罩
              this.$message({
                message: "提交成功",
                type: "success",
              });
              this.cancel();
            }
          });
        }