vue全局事件总线

在vue中存在这么一个内置关系

VueComponent.prototype.__proto__ === Vue.prototype 

这是为了让vc(也就是组件中)可以使用到Vue原型上的属性，方法比如 $mount $watch $emit等

        在这个关系的基础上，再来解释vue的全局事件总线  一句话来解释就是 有一个方法或者属性，在任何的 vc 和 vm 里都可以使用，通过这幅图可以看出来就应该写在vue的原型对象上，也就是说是在Vue.prototype,如果写在vueComponent的prototype上，一者，只能vc访问，vm不能访问，再者，每次创建一个组件都会对应的有一个vueComponent的原型对象，也不现实

        解决方法

const demo = Vue.extend({})
const d = new demo()
//这个d就是组件d


Vue.prototype.$bus = d //这样在各个vc的组件上和vm，都有这个$bus方法
new Vue({
    el:'#app',
    render: h => h
})

        下面这个是有问题的方法

new Vue({
    el:'#app',
    render: h => h
})
Vue.prototype.$bus = vm

这样看起来能用了，因为各个vc 和 vm 都可以访问到 Vue.prototype这个对象

但是有一个致命的问题，Vue.prototype.$bus = vm 这个已经在页面完成之后才去执行的，所以就没办法得到，你写在上面也是错误的 因为 vm 还没new呢

最终的解决方法 如下

new Vue({
    el:'#app',
    render: h => h,
    beforeCreate(){
        Vue.prototype.$bus = this
    }
})

亦或是单独创建一个文件 bus

import Vue from 'vue'
export default new Vue   

这里虽然写的是new Vue，但是去用$emit的方法的时候，还是会到

原型链上找，所以也是可以的

哪个组件要用，就引入使用

例如

        import bus from '../common/bus' 

        this.$emit('mineClick',this.bro)  这样也是可以使用的