导言

eventBus的实现其实可以简单地直接用一个 vue 实例来实现。

概论

Vue 组件实例上自定义事件的监听,触发和移除。

$on 本身是一个函数 , 作用是为组件实例绑定自定义事件,事件由$emit触发。$on函数由两个参数,第一个参数指定事件名称,第二个参数指定回调函数,回调函数可以接收 $emit传递的所有额外参数。第一个参数有两种类型,其一字符串,用于绑定单个事件，其二数组,用于同时绑定多个事件。

vue.$on('adList', (e) => {
	console.log(e)
})

vue.$on(['adList1','adList2'], (e) => {
	console.log(e)
})

$emit 本身是一个函数,可以触发组件实例上绑定的自定义事件,并传入额外参数给监听器的回调函数。 $emit 函数的第一个参数必填,指定触发的事件, 其余参数选填,均为传入事件回调的参数。

vue.$emit(event, [p1,p2,..])

$on可以为同一个事件绑定多个监听器, $emit触发该事件时, 监听器按照绑定顺序依次执行

vue.$on('jpf', () => {
	console.log('事件1')
})
vue.$on('jpf', () => {
	console.log('事件2')
})

vue.$emit('jpf')

$off 本身是一个函数,用来移除组件实例上绑定的自定义事件监听器。该函数有两个参数,第一个参数指定移除的事件，第二个参数指定回调函数。

vue.$off([event, callback])

$off 有三种用法

$off 函数的第一个参数有两种类型