mitt应用 及 mitt触发多次接受函数
vue3中使用bus中央事件, mitt的使用,解决mit
·
项目场景:
在vue3 的项目中需要用到vue2中的bus 中央事件, 于是就找到了mitt。但是在项目中发现mitt监听事件会多次的触发,记录一下这个问题的解决方法及mitt 的基本使用。
mitt安装
下载包
npm install --save mitt
在main.js中引入使用
import mitt from "mitt";
const app = createApp(App);
app.config.globalProperties.$bus = mitt(); // 自定义添加
mitt使用方法:
(1)在任意一个页面触发 添加一个动态组件
this.$nextTick(function() {
this.$bus.emit("事件名称","传递的参数"),
})
(2)在动态组件中监听事件
mounted() {
this.$bus.on("事件名称", (接收的参数) => {
console.log(接收的参数)
})
}
解决mitt多次触发的方法:
每当页面关闭的时候, 去销毁这个事务线程 (在监听事件的页面)【vue3.0 页面销毁生命周期是beforeUnmount】
beforeUnmount() {
this.$bus.all.delete("changeOdr")
}
更多推荐
已为社区贡献7条内容
所有评论(0)