antdv Spin组件拓展

antdv 组件库种Spin组件未提供直接的函数式全局调用方法;
在ajax请求,或者其他一些用纯js中需要调用的时候比较麻烦。
基于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;

你可能感兴趣的:(vue.jsantd-vue)