antdv Spin组件拓展

antdv 组件库种Spin组件未提供直接的函数式全局调用方法;
在ajax请求,或者其他一些用纯js中需要调用的时候比较麻烦。
基于Spin拓展
【antdv Spin组件拓展】util/decorator/spin

import Vue from "vue"; import { Spin } from "ant-design-vue"; let instance = null; function getInstance() { if (!instance) { instance = new Vue({ data: { show: false, }, methods: { loading() { this.show = true; }, close() { this.show = false; }, }, render(h, data) { const fullscreenLoading = { position: "fixed", left: 0, top: 0, width: "100%", height: "100%", display: "flex", justifyContent: "center", alignItems: "center", }; return this.show ? () : ( "" ); }, }); const component = instance.$mount(); document.body.appendChild(component.$el); }return instance; }Spin.show = function () { getInstance().loading(); }; Spin.hide = function () { getInstance().close(); }; export default Spin;

    推荐阅读