vue2 使用的EventBus事件总线 在vue3 已经被弃用了;
vue3 使用的事件总线为 mitt,可用父子组件,兄弟组件之间通信
我使用的方法如下
新建一个mitt.ts文件保存以下内容
import mitts, { Emitter } from "mitt";
// 定义类型别名,因全局使用并且需要自定义事件名称,所以使用索引签名定义内容
type Events = {
[propName: string]: any;
};
// 提供泛型参数让 emitter 能自动推断参数类型
const mittBus: Emitter<Events> = mitts<Events>();
export default mittBus;
在需要的地方引用
在组件1中使用 onBeforeMount 加载组件挂载之前需要进行的准备工作
onBeforeMount(() => {
mitss.on('CCC', (e: string) => {
console.log(e);
})
})
在组件2中使用
//点击事件
function cliskCity() {
mitss.emit('CCC', "参数")
}
如果有什么不对的地方,还请指正出来,谢谢