vue遮罩层正在提交功能（兼容基本所有页面）页面转圈等待效果

代码很简单，如下

<div style="height:850px"
       v-loading="loading"
       element-loading-text="正在提交..."
       element-loading-spinner="el-icon-loading"
       element-loading-background="rgba(0, 0, 0, 0.8)">
       需要遮罩的内容
       </div>
       //js申明
 data: function () {
      return { 
      loading:false,
      }
    },

使用方法示例

  //提交流程方法
      handleSave: function (tag,form) {
        debugger;
        var _this = this;
        if(form.comment&&form.comment!=""){
          _this.loading=true;
          this.selectItems.forEach(function (id) {
            debugger;
            _this.dialogFormVisible = false;
            CR02toWorkflowSave(id,form.comment).then(response=>{
              debugger;
              _this.loading=false;
              _this.$message.success('提交成功!');
              _this.$router.go(0);
            })
          })
        }else{
          this.$message({
            message: '审批意见不能为空',
            type: 'warning'
          });
        }
      },

开始前申明true,结束改为false
效果图

end不懂留言