VUE3之Component（二）

事件总线库mitt的使用

首先安装mitt：

npm install mitt

写一个工具类eventBus.js导出一个emitter实例：

import mitt from "mitt";
const emitter = mitt();

export default emitter;

通过键值对的方式向emitter注册一个消息：

        methods: {
            btnClick(){
                console.log("about按钮点击");
                emitter.emit("why",{name:"sk",age:18});
                emitter.emit("kobe",{name:"kobe",age:30});
            }
        },

在一个组件的created生命周期中注册监听一个消息：

        created() {
            emitter.on("why",(info)=>{
                console.log("why",info);
            });
            emitter.on("kobe",(info)=>{
                console.log("kobe",info);
            });

            // *表示所有的事件
            emitter.on("*",(type,info)=>{
                console.log("* listener",type,info);
            })
            
            // 取消emitter的所有监听
            // emitter.all.clear();

            // 定义一个函数
            // function onFoo(){}
            // emitter.on("foo",onFoo);
            // emitter.off("foo",onFoo);
        },