Vue触发式全局组件构建的方法

/**   * onShow - 控制组件显示   *   * @return {type}   */  onShow() {   this.uploadModalShow = true  },

import uploadModalComponent from './template.vue'import Vue from 'vue'// 构造组件let uploadModalConstructor = Vue.extend(uploadModalComponent);// 组件实例let $vue;// 生成domlet initUploadModal = ()=>{  // 实例化  $vue = new uploadModalConstructor({    el: document.createElement('div')  });  // 注入页面  document.body.appendChild($vue.$el);}const UploadModal = (success = () => {}, fail = () => {}) => { // 初始化构架dom结构 initUploadModal() // 注入回调函数 if (success instanceof Function) $vue.success = success; else console.error('传入成功回调函数'); if (fail instanceof Function) $vue.fail = fail; else console.error('传入失败回调函数'); // 组件显示 $vue.onShow()}export default UploadModal

// 图片上传弹框工具import uploadModel from './init.js'const UploadModel = { install(Vue) {   //注册全局组件   Vue.component(uploadModel.name, uploadModel)   //添加全局API   Vue.prototype.$uploadModel = uploadModel }}export default UploadModel;

// 更换图片import ShowUpLoadModal from './plugin/upLoadModal';Vue.use(ShowUpLoadModal);