自定义事件总线

Posted 黑胡子大叔的小屋

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了自定义事件总线相关的知识,希望对你有一定的参考价值。

参考博文:
https://juejin.cn/post/7101481154565865486#heading-5

class eventBus 
	constructor()
		this.eventObj = ; // 用于存储所有订阅事
	
	$on(name, callbcak) 
		// 判断是否存储过
		if (!this.eventObj[name]) 
			this.eventObj[name] = [];
		
		this.eventObj[name].push(callbcak); // 往事件数组里面push
	
	$emit(name, ...args) 
		// 获取存储的事件回调函数数组
		const eventList = this.eventObj[name];
		// 执行所有回调函数且传入参数
		for (const callbcak of eventList) 
			callbcak(...args);
		
	

使用

let EB = new eventBus() 
EB.$on('key1',(name,age)=>
    console.log('订阅事件',name,age)
) 
EB.$emit('key1','小猪佩奇',12)

输出:订阅事件 小猪佩奇 12

以上是关于自定义事件总线的主要内容,如果未能解决你的问题,请参考以下文章

自定义事件总线

学Vue就跟玩一样组件的自定义事件和全局事件总线

AWS 事件总线无法将日志写入来自 AWS Lambda 的自定义日志组上的 CloudWatch

风险洞察之事件总线的探索与演进

风险洞察之事件总线的探索与演进

Vue事件车,非父子组件通讯$bus,$event,中央事件总线