typeScript 发布订阅 eventBus 模拟vue2

class Bus {

    list: { [key: string]: Array<Function> };

    constructor() {

        // 收集订阅信息,调度中心

        this.list = {};

    }

    // 订阅

    $on(name: string, fn: Function) {

        this.list[name] = this.list[name] || [];

        this.list[name].push(fn);

    }

    // 发布

    $emit(name: string, data?: any) {

        if (this.list[name]) {

            this.list[name].forEach((fn: Function) => {

                fn(data);

            });

        }

    }

    // 取消订阅

    $off(name: string) {

        if (this.list[name]) {

            delete this.list[name];

        }

    }

}

const Eve = new Bus()  // 实例化

export default Eve;

import Eve from '@/utils/eventBus' // 订阅模式夸组件事件

const handleClick = () => {

    Eve.$emit('handleMenu','hello1') // 发布

}

  import Eve from '@/utils/eventBus' // 订阅模式夸组件事件

  // 页面挂载

  onMounted(() => {

      Eve.$on("handleMenu", (v) => {

        handleMenu1(v)  // 接收

      });

  })