vue在封装的组件上挂载全局方法

1.背景

全局js文件里面想要修改组件中的数据

2.实现

import Vue from 'vue'
import componentA from '@/components/A'
const aConstructor = Vue.extend(componentA )
let acl
export default {  
    show () {    
        if (!acl) {      
            acl= new aConstructor ({    
                el: document.createElement('div')   
            })  
        }   
     document.body.appendChild(acl.$el)
    // 修改componentA中visible数据    
    acl.visible= true  
    },  
    close () {    
        if (acl) {
            acl.visible=false   
         }  
    }
}

3.js文件中就直接可以调用show()方法来直接修改A组件中visible的数据了

import componentA from '@/components/A'
ESigna.show()