class MyEvent<T> extends CustomEvent<T> {
public static readonly CMD: string = "EVENT_NAME";
public constructor($type: string , $data: T ) {
super( $type , { detail: $data, bubbles: true, cancelable: true, composed: true });
}
}
class MyDispatch extends EventTarget {
private static _instance: MyDispatch;
public static get Instance(): MyDispatch {
if (!MyDispatch._instance) MyDispatch._instance = new MyDispatch();
return MyDispatch._instance;
}
public send<T>($data: T, $type: string = MyEvent.CMD): void {
const $event: CustomEvent = new MyEvent<T>($type, $data);
this.dispatchEvent($event);
}
}
class Test {
public constructor() {
MyDispatch.Instance.addEventListener(MyEvent.CMD, this.onEvent as EventListener);
}
private onEvent($e: MyEvent<ITest>): void {
console.log(`target ${$e.target}`);
console.log(`name: ${$e.detail._name} , occupation: ${$e.detail._occupation}`);
}
}
interface ITest {
_name: string;
_occupation: string;
}
let $test: Test = new Test();
MyDispatch.Instance.send<ITest>({ _name: `Aonaufly`, _occupation: `it` });
原文：https://blog.51cto.com/aonaufly/2467379