自定义事件

  1. vm对象具有绑定和分发事件的能力，通过触发监听，传递数据给函数实现组件间通信

在父组件与子组件中使用

子向父通信的基本方式之一，通过父组件包含子组件的实例对象来完成绑定监听

  1. //通过组件绑定 
  2. <Event1 @click="test"></Event1>
  4. //通过ref获取子组件绑定
  5. <Event1 ref="event1"></Event1>
  6.  mounted() {
  7.     this.$refs.event1.$on('click',this.test)
  8.   },
  10. //子组件
  11.  this.$emit('click',data) 传递数据

全局事件总线

任意组件对象都能访问到，Vue.prototype 此时将vm 挂载到Vue.prototype，就可以实现全局事件总线，完成任意组件间通信

  1. /* 
  2. 组件实例： this
  3. 应用实例： vm
  5. this.__proto__ = vm
  6. this.__proto__.__proto__ = Vue.prototype
  7. */
  8. beforeCreate(){
  9.    Vue.prototype.$Bus = this
  10. }

全局事件总线对象的两个特定

  1. 一个对象具有绑定和分发事件的功能
  2. 所有组件对象都能够访问 利用原型对象共享数据

注意事项
使用全局事件总线，当切换组件时及时销毁$off，不然重复进入组件可能会绑定多个事件

本质上还是利用函数形参接收数据，创建一个容器用于管理函数，调用函数完成发送数据 结构

  1. { 
  2. key:[] 
  4. }

管理不够集中，太过分散

Vue自定义事件 - 图1