美文网首页
vue 对elementUI 中的服务方式调用Loading.s

vue 对elementUI 中的服务方式调用Loading.s

作者: wxw_威 | 来源:发表于2023-02-08 15:20 被阅读0次

    首先创建一个loading.js

    import { Loading } from 'element-ui';
    // Loading 中的配置项
    const loadingOptions = {
      text: '努力加载中...'
    }
    
    let loadingInstance;
    class LoadingEvent {
      show() {
        loadingInstance = Loading.service(loadingOptions)
      }
      hidden() {
        loadingInstance.close()
      }
    }
    export default new LoadingEvent()
    

    在main.js 中引用

    import loading from '@/utils/loading'
    ...
    // Vue.prototype.$loading 这样定义无效,应该是element 定义的loading覆盖了
    Vue.prototype.$loads = loading
    ...
    

    在.vue文件中使用

    login() {
      // 显示loading
      this.$loads.show()
        setTimeout(() => {
            // 关闭loading
           this.$loads.hidden()
        }, 2000);
    }
    
    

    相关文章

      网友评论

          本文标题:vue 对elementUI 中的服务方式调用Loading.s

          本文链接:https://www.haomeiwen.com/subject/gypqkdtx.html