共计 673 个字符,预计需要花费 2 分钟才能阅读完成。
定义
全局定义,能够将 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');
正文完