摘要
CocosCreator 有著內置的事件系統(tǒng)，我們用起來也很是方便捐友。那么我們自己如何簡單的實現一個 EventManager 呢霎肯？本文通過一個小例子帶你學習。
- 使用版本
CocosCreator 版本 2.3.3 -
明確目標
我們要做一個事件管理模塊蜀肘，實現事件的監(jiān)聽方法 on，取消方法 off稽屏，事件發(fā)送 emit扮宠。
事件數據類型
- 首先，我們要想好事件用什么存儲狐榔。選擇用 Map坛增，則需要一個事件名稱，類型 string薄腻，還有就是一個對象收捣，存放 callback 以及調用者 target。
- 寫成單例模式
/**
* 事件數據接口
*/
interface EventData{
callback : Function,
target:any
}
/**
* 單例模式
*/
export class MyEventManager {
private static mInstance: MyEventManager = null;
/**
* 事件存儲 Map
*/
private eventsMap:Map<string , EventData> = new Map();
public static instance(): MyEventManager {
if (this.mInstance == null) {
this.mInstance = new MyEventManager();
}
return this.mInstance;
}
/**
* 事件監(jiān)聽
* @param eventName 事件名字
* @param callback 返回方法
* @param target
*/
public on(eventName:string , callback:Function , target:any){
if(this.eventsMap.has(eventName)){
console.warn(`$(eventName) 事件已存在 庵楷， 做了覆蓋處理`);
}
this.eventsMap.set(eventName , {callback , target});
}
/**
* 事件發(fā)送
* @param eventName
* @param data
*/
public emit(eventName:string , data:any){
if(!this.eventsMap.has(eventName)){
console.warn(`$(eventName) 事件不存在`);
return;
}
const {callback , target} = this.eventsMap.get(eventName);
callback.call(target , data);
}
/**
* 取消事件監(jiān)聽
* @param eventName
*/
public off(eventName:string){
if(!this.eventsMap.has(eventName)){
console.warn(`$(eventName) 事件不存在`);
return;
}
this.eventsMap.delete(eventName);
}
}
