vue3使用mitt用于组件之间传值

vue3已经没有提供配套的事件总线bus,需要使用第三方库mitt 来完成vue2中bus完成的事情

1.安装

javascript 复制代码
npm install mitt

2.引用 bus.js

javascript 复制代码
import mitt from 'mitt';
const bus  = mitt();
export default bus;

3.在需要使用的vue文件中导入bus

javascript 复制代码
import bus from './mitt'

4.使用mitt的emit方法进行传值和on方法进行接收数据

javascript 复制代码
// 父组件(兄弟组件)
bus.emit('函数名', 需要传的值)

//子组件(兄弟组件)
bus.on('函数名',(接收到的值)=>{
	逻辑操作
})
//接收值的vue 组件卸载之前关闭掉
onBeforeUnmount(()=>{
	bus.off('函数名');//关闭
})

//清除bus线
emitter.all.clear()
相关推荐
石小石Orz12 小时前
给Claude增加状态栏显示:claude-hud保姆级教程
前端·人工智能·后端
chushiyunen13 小时前
typescript笔记、ts笔记、npx命令
javascript·笔记·typescript
ZC跨境爬虫13 小时前
跟着 MDN 学 HTML day_55:HTML 音频与视频嵌入实战指南
前端·javascript·ui·html·音视频·媒体
276695829213 小时前
阿里图像修复验证码自动化分析
java·前端·自动化·阿里滑块·drssionpage·阿里图像修复验证码·阿里图像复原
Jack N13 小时前
2026 浏览器原理 常见面试题(附答案)
前端·html·浏览器
何何____13 小时前
CSS 易混淆易错知识点
前端·css
北山有鸟13 小时前
常用的快捷键
linux·前端·chrome·单片机·学习
KaMeidebaby13 小时前
卡梅德生物技术快报|噬菌体筛选全流程技术方案:弧菌抑菌菌株筛选、特性鉴定与效果测试
前端·数据库·其他·百度·新浪微博
m0_5027249513 小时前
golang 、java、c++、javascript 语言switch case异同
java·javascript·c++·golang