15-手动全屏loading

效果:数据加载完成后,loading会取消

 代码:

let loadingInstance = null
  data() {
    return {
      loadComplete:false
    }
  },
  watch: {
    loadComplete(val) {
      if (!val) {
     // 更多参数参考官网文档 loadingInstance
= this.$loading({ fullscreen: true, text: '正在加载中,请耐心等待', spinner: 'el-icon-loading', background: 'rgba(0,0,0,0.65)' }) } else { loadingInstance.close() } } },
methods:{
  //在调用接口的方法中的finally中:
  this.loadComplete = true // 不要写在then里面,确保不会因为接口报错一直loading卡住
}

 

posted @ 2022-03-25 11:40  猎奇游渔  阅读(72)  评论(0编辑  收藏  举报