手撕eventBus
2020年8月7日
vue用法
// main
Vue.prototype.eventBus = new Vue()
// comp1
this.eventBus.$emit('handle','value')
// comp2
this.eventBus.$on('handle', callback)
使用纯 js 实现
class EventBus {
constructor() {
this.events = {}
}
on(eventName, cb) {
if(cb) this.events[eventName] = cb
else this.events[eventName] = null
}
emit(eventName, arg) {
if(this.events[eventName]) {
return this.events[eventName](arg)
}
}
}
let bus = new EventBus()
bus.on('event', arg => console.log('event', arg))
bus.emit('event', 123) // event 123
bus.on('handle', arg => console.log('handle', arg))
bus.emit('handle', 'hello world') // handle hello world
console.log(bus);