this.$eventHub Vue2.0 事件的广播与接收(观察者模式)
Vue2.0中可以使用$emit , $on, $off 分别来分发、监听、取消监听事件。官方的给出的最简单的升级建议是使用集中的事件处理器,而且也明确说明了 一个空的vue实例就可以做到,因为Vue 实例实现了一个事件分发接口。
在main.js中声明【eventHub】的Vue对象。
Vue.prototype.$eventHub = Vue.prototype.$eventHub || new Vue();
A页面:
在【onload】生命周期调用广播接收。
onLoad:function(){
this.$eventHub.$on('show',(data) => {
console.log(data);
})
},
B页面:
事件中调用发送广播。
methods: {
test:function(){
this.$eventHub.$emit('show','测试广播');
},
//关闭监听
close:function(){
this.$eventHub.$off('show');
}
}
控制台打印:测试广播