vue3+ts 任意组件间的通信 mitt的使用

1、新建以下文件夹:

2、父组件、兄弟姐妹组件美容,如下:

3、在router/index.ts文件中引入父组件,并添加路由

4、在App.vue中加菜单

5、打开控制台,输入:

复制代码
npm I mitt

6、建src/utils/emitter.ts文件,内容如下:

7、在兄弟页面ref腾个空位置,通过emitter.on方法传递,在界面上展示出来

8、在姐妹页面给她一辆车,再给个点击事件,通过点击效果把车传给兄弟

9、效果如图

相关推荐
kyriewen3 分钟前
CSS Container Queries:彻底告别 @media 写到手软,附 5 个真实布局案例
前端·css·面试
Patrick_Wilson1 小时前
router.replace 之后紧跟 reload,页面为什么无限刷新?
javascript·react.js·浏览器
小小小小宇2 小时前
OpenMemory MCP
前端
和平宇宙2 小时前
AI笔记005. hermes-DeepSeek V4 Pro, 128K上下文引发的探索
前端·人工智能·笔记
IT_陈寒2 小时前
Redis持久化这个坑,我爬了一整天才出来
前端·人工智能·后端
naildingding3 小时前
3-ts接口 Interface
前端·typescript
mONESY3 小时前
JavaScript 栈、队列、数组与链表核心知识点总结
javascript·面试
小小前端仔LC3 小时前
Node.js + LangChain + React:搭建个人知识库(六)- “吃什么”项目实战:从700+菜谱入库到Taro H5端JSON渲染
前端·后端
ZengLiangYi3 小时前
TypeScript 项目配置:tsconfig、ESM、路径别名
javascript·typescript·aigc
晓13133 小时前
【Cocos Creator 3.x】篇——第二章 入门
前端·javascript·游戏引擎