Vue 3.x 中实现非父子组件传值 mitt

Vue 3.x中非父子组件是需要通过一个第三方插件mitt来完成的

一、首先安装插件 mitt

npm install --save mitt

二、创建文件 model/event.js

import mitt from 'mitt'
const VueEvent=mitt();
export default VueEvent;

三、使用mitt 实现传值
比如我们想要在header组件给login组件传值
1、我们需要在header 和 login 两个组件都引入 import VueEvent from '../model/event'
2、header组件中通过 VueEvent.mitt("tomsg","传值")发布广播
3、login组件中通过 VueEvent.on("tomsg",(value)=>{ })监听广播