我是靠谱客的博主 懦弱招牌,这篇文章主要介绍Vue3 事件总线为什么要使用总线事件总线事件系统逻辑:Vue2 创建方式vue3官网推荐使用 mitt 第三方库**Vue3 官网 关于事件总线给出的说明**,现在分享给大家,希望可以做个参考。
为什么要使用总线事件
答:一般父子组件通信,就直接使用事件抛出emit就好,但是如果两个组件没有关系 或者 关系嵌套层级很多,就要采用总线事件系统。
总线事件系统逻辑:
A组件抛出事件名a,B组件里面,在mounted生命周期监听事件名a,并做出处理。
Vue2 创建方式
import Vue from 'vue';
Vue.prototype.$bus = new Vue();
为什么这样使用呢?
因为 在 Vue2 API 中实例方法/事件 中,存在这个 vm.$on 和vm.$emit 两个接口


vue3官网推荐使用 mitt 第三方库
npm install --save mitt
//main.js
import { createApp } from 'vue'
import App from './App.vue'
const app = createApp(App)
//挂载事务总线
import mitt from 'mitt'
app.config.globalProperties.$bus = new mitt();
app.use(Vue3DraggableResizable);
app.mount('#app')
在其它组件使用
//事件抛出
this.$bus.emit("closeCommunicateFrame");
//事件接收
this.$bus.on('closeCommunicateFrame',()=>{
this.communicateObj.isShow = false;
})
========================== 分割线 ======================================
**Vue3 官网 关于事件总线给出的说明**
根据官网说明,不鼓励使用总事件系统,优先使用其它替代方案去解决

最后
以上就是懦弱招牌最近收集整理的关于Vue3 事件总线为什么要使用总线事件总线事件系统逻辑:Vue2 创建方式vue3官网推荐使用 mitt 第三方库**Vue3 官网 关于事件总线给出的说明**的全部内容,更多相关Vue3内容请搜索靠谱客的其他文章。
本图文内容来源于网友提供,作为学习参考使用,或来自网络收集整理,版权属于原作者所有。
发表评论 取消回复