手写eventBus事件总线
Posted 幸福是奋斗出来的
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了手写eventBus事件总线相关的知识,希望对你有一定的参考价值。
注册一个全局的事件总线,来处理页面/组件间的通信
class EventBus{
constructor() {
this.events = {}
}
$on(name,listener) {
if(!name || !listener)return;
if(Array.isArray(name)){
for(let i = 0; i < name.length; i++){
this.$on(name[i],listener);
}
}else{
if(!this.events[name]){
this.events[name] = []
}
this.events[name].push(listener);
}
}
$emit(name) {
if(!this.events)return;
let args = Array.prototype.slice.call(arguments, 1);
for(let key in this.events){
if(this.events.hasOwnProperty(key) && key === name) {
const listener = this.events[name];
if(!listener)return;
for(let i = 0;i<listener.length;i++){
if(typeof listener[i] === \'function\') {
listener[i](...args);
}
}
}
}
}
$once(name, listener) {
if(!name || !listener)return;
const that = this;
const _listener = function(){
listener.apply(that,arguments);
that.$off(name);
}
this.$on(name, _listener);
}
$off(name) {
if(!this.events || !name)return;
if(Array.isArray(name)) {
for(let i = 0; i < name.length; i++) {
this.$off(name);
}
}else{
if(this.events[name]){
delete this.events[name];
}
}
}
}
以上是关于手写eventBus事件总线的主要内容,如果未能解决你的问题,请参考以下文章