Vue3全局组件通信之EventBus

Vue3全局组件通信之EventBus

1. 需要安装 mitt

npm install --save mitt

2. 在main.js全局引入

import mitt from 'mitt';
app.config.globalProperties.mittBus = mitt();

3. 页面内使用方法

import { onMounted, ref, getCurrentInstance } from 'vue';
const { proxy } = getCurrentInstance();
//注册监听事件，接收传参
proxy.mittBus.on('visitDataTimeLine', (data) => {
   visitId.value = data.visitId; 
});
//调用方法传递数据
proxy.mittBus.emit('visitDataTimeLine',data);
//移除监听事件
proxy.mittBus.off('visitDataTimeLine');