vue3非父子组件间传值

本示例基于vue3

使用要点：发送数据---- $bus.emit('password',num)

接收数据----在onMounted() 中  $bus.on('password',(data)=>{})

双方定一个交换数据的号码，使用该号码发送或接收数据

1、安装 npm i mitt

npm i mitt

2、在src文件夹下utils文件夹，在其下在新建bus.js文件

import mitt from 'mitt';
const $bus = mitt();
export default $bus;

3、使用

简单示例

新建两个兄弟组件，demoA发送数据，demoB接收数据

demoA

demoB接收数据

 踩坑点：

1、点击一次，触发多次，导致多次传递重复的值

解决办法：

在传值的页面加上 ↓

onUnmounted(() => {
    $bus.off('event');
});