关于vue.js:VueEventBus

定义

全局定义，能够将 eventBus 绑定到 vue 实例的原型上, 也能够间接绑定到 window 对象上。

//main.js(能够是任意 JS 写)
// 形式一
Vue.prototype.$EventBus = new Vue();
// 在 mian 中，形式一能够这么写
new Vue({
  router,
  render: h => h(App),
  beforeCreated() {Vue.prototype.$EventBus = this}
}).$mount('#app')

// 形式二
window.eventBus = new Vue();

触发事件

// 应用形式一定义时
this.$EventBus.$emit('eventName', param1,param2,...)
// 应用形式二定义时
EventBus.$emit('eventName', param1,param2,...)

监听事件

// 应用形式一定义时
this.$EventBus.$on('eventName', (param1,param2,...)=>{// 须要执行的代码})
// 应用形式二定义时
EventBus.$on('eventName', (param1,param2,...)=>{// 须要执行的代码})

移除监听事件

为了防止在监听时，事件被重复触发，通常须要在页面销毁时移除事件监听。或者在开发过程中，因为热更新，事件可能会被屡次绑定监听，这时也须要移除事件监听。

// 应用形式一定义时
this.$EventBus.$off('eventName');
// 应用形式二定义时
EventBus.$off('eventName');