elmentUI中 v-loading.fullscreen实现

if (binding.value) {
    // v-loading=ture
    el.instance.visible = true;
    if (binding.modifiers.fullscreen) {          
        addClass(el.mask, 'is-fullscreen');
    }
}

用服务方式使用Loading

import Vue from 'vue';
import loadingVue from './loading.vue';
import { addClass } from '../../utils/dom'

const LoadingConstructor = Vue.extend(loadingVue);

LoadingConstructor.prototype.close = function() {
    this.visible = false;
}

const loadingService = () => {
    let instance = new LoadingConstructor({
        el: document.createElement('div'),
    });
    if (instance.originalPosition !== 'absolute' && instance.originalPosition !== 'fixed') {
        addClass(parent, 'el-loading-parent--relative');
    }

    document.body.appendChild(instance.$el);
    instance.visible = true;

    return instance;
}

export default loadingService;

在main.js中使用loadingService：

import loadingService from './components/Loading/service.js'
Vue.prototype.$loading = loadingService;

作者：猎户座小陈
来源：掘金