什么是中央事件总线？中央事件怎么用？

最新推荐文章于 2022-05-19 13:34:04 发布
最新推荐文章于 2022-05-19 13:34:04 发布
阅读量1.2k 收藏 7
点赞数 3
分类专栏： 笔记 文章标签： vue.js
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_48653480/article/details/108694724
版权

什么是中央事件总线？具体用法

vuex同级组件传值------中央事件总线
什么是中央事件总线？

创建一个新的Vue实例，以后它就承担起了组件通信的桥梁，也就是中央事件总线

利用中央事件总线实现同级组件传值（一下是具体用法分为五步）

1、先创建中央事件总线，在src下创建一个文件夹eventBus在这个文件下创建index.js文件，在这个文件中创建一个新的vue实例，以后就又他承担起组件之间通信的桥梁，即中央事件总线。
在这里插入图片描述

2、在components文件下创建同级组价，例如组件A和组件B。
在这里插入图片描述

3、在组件A中组件引入中央事件总线。
在这里插入图片描述

4、在组件A中添加一个单机事件，进行自定义事件抛出。
在这里插入图片描述
5、在B组件，引入事件简js总线，在mounted钩子监听自定义事件，并将传递过来的字符串传给$on:监听当前实例上的自定义事件
在这里插入图片描述

果冻~
关注
  • 3
    点赞
  • 踩
  • 7
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
Vue组件通信中央事件总线实例
09-28
介绍Vue组件之间的通信方式，本资源主要是介绍中央事件总线这种模式，代码中详细示范了如何使用中央事件总线来通信
Vue-中央事件总线（bus）
qq_56973906的博客
09-09 3274
通过创建一个新的vm对象,专门统一注册事件,供所有组件共同操作,达到所有组件随意隔代传值的效果也就是：各个组件内部要传输的数据或者要执行的命令信息，靠bus来通信。我们知道子组件向父组件传值可以通过将自定义事件的方法来进行，那么如果我们把事件绑定在所有组件都能访问的地方，然后想要给某个组件通信，直接触发这个事件。//1.触发x组件的a事件: x.$emit("a事件",参数...)//2.给x组件绑定a事件 x.$on("a事件",监听器函数)
vue 中央事件总线
wy01272454的博客
08-31 1万+
最近项目问题 兄弟组件通信 组件前进刷新,后退不刷新 1.组件通讯 父子组件之间传递数据子组件通过props来接受父组件传递的数据,在兄弟组件之间传递数据的话可以使用框架vuex,对于不是庞大的单页面应用就不太适合使用了, vue 官网提供了一种方法叫做 中央事件总线 // 新建一个 Bus.vue文件,new 一个 vue 实例导出 export default new Vue({ n
中央事件总线
Drizzlejj的博客
05-19 574
公共事件总线eventBus的实质就是创建一个vue实例，通过一个空的vue实例作为桥梁实现vue组件间的通信。它是实现非父子组件通信的一种解决方案。 用法如下： 第一步：项目中创建一个js文件（我通常给它取个名字为bus.js），引入vue，创建一个vue实例，导出这个实例，代码如下（一共就两行）： import Vue from 'Vue' export default new Vue 第二步：在两个需要通信的两个组件中分别引入这个bus.js import Bus from '这里是你.
vue中央事件总线
煮酒客的博客
03-05 125
中央事件总线 <body> <div id="app"></div> <script src="./js/vue.js"></script> <script> var bus = new Vue(); Vue.component('brother1',{ ...
事件总线的使用
Barryjacket的博客
07-22 320
作用：解决了应用程序内各个组件或者组件和后台服务之间的通信问题 基础用法 源码分析 构造方法：使用了(dcl)确保单例,构造函数中调用了另一种构造方法，使用建造者模式–通过EventBusBuilder 来完成对EventBus的配置和构造。 构造方法的流程 ...
基于总线技术的中央空调控制系统
10-22
因此对这样一个系统进行监测、控制和管理，以实现安全、高效、节能的目的，并使设备损耗降低，延长使用寿命，最有效的方法是实现空调控制系统本身的集成，以及控制系统与信息系统的集成，实现计算机一体化的集成管理...
CAN总线在VRV变频中央空调中的应用.pdf
05-16
CAN总线在VRV变频中央空调中的应用.pdfCAN总线在VRV变频中央空调中的应用.pdfCAN总线在VRV变频中央空调中的应用.pdfCAN总线在VRV变频中央空调中的应用.pdfCAN总线在VRV变频中央空调中的应用.pdf
vue-bus-适用于Vue.js的微型简单中央事件总线插件2。-Vue.js开发
05-27
vue-bus一个很小的简单的中央事件总线插件，用于Vue.js（需要Vue> = 2.0）。 该插件实现了非亲子沟通。 （655字节gzip）在vue-bus中一个用于Vue.js的微型中央事件总线插件（需要Vue> = 2.0）。 该插件实现了非亲子...
Android EventBus实战
热门推荐
Dream It Possible
11-06 1万+
1、概述 最近大家面试说经常被问到EventBus，github上果断down了一份，地址：https://github.com/greenrobot/EventBus，的确是个不错的框架，主要用于事件的发布和订阅。 EventBus定义：是一个发布 / 订阅的事件总线。 这么说应该包含4个成分：发布者，订阅者，事件，总线。 那么这四者的关系是什么呢？ 很明显：订阅者
Vue 中央事件总线（非父子组件间通信）
最爱喝怡宝的博客
12-17 758
通过一个"空的vue实例"来进行值传递 组件1--- $emit()---空vue实例---$on---组件2 创建一个空实例(bus中央事件总线，或者叫中间组件) 利用$emit $on的触发和监听事件 实现非父子组件的通信 方法： 1.在vue行挂载一个$bus作为中央处理组件 Vue.prototype.$bus = new Vue(); 2.触发自定义事件传递数据 this.$bus.$emit('自定义事件名','传递的数据') 3.监听自定义事件获取数据 this.$bus.
Vue 事件中央总线
追风筝的博客
04-08 947
VUE 任意组件间传值的方式
bus中央事件总线
Sue's blog
05-09 701
公交事件总线bus ,指的是一个空的Vue实例， bus=new Vue({}),用于组件之间的 简单通信。 一、$emit 1、bus $emit（‘自定义事件名’,要传送的数据）；触发当前实例上的事件，要传递的数据会传给监听器。 二、on1、bus.on 1、bus.on1、bus.on(‘事件名’,callback) --------------------callback回调$emit要传送的数据； eg：routerJsonChange 这个事件是实例自带的。bus._events打印结果中
Vue之中央事件总线bus
weixin_48842132的博客
01-18 1103
快速上手使用中央事件总线bus解决兄弟组件和跨多级组件通信问题
VUE-中央事件总线插件vue-bus
shenzhen_zsw的专栏
07-16 542
      vue-bus.js const install = function (Vue) { const Bus = new Vue({ methods: { emit (event, ...args) { this.$emit(event, ...args); }, ...
事件总线的简单使用
ali的博客
11-27 574
根build添加依赖 implementation 'org.greenrobot:eventbus:3.1.1' 创建ActivitySupport继承AppCompatActivity 并在 onCreate中添加EventBus.getDefault().register(this); onDestroy中添加EventBus.getDefault().unregister(this); 新建的活动应该继承ActivitySupport ...
vue组件传值（一）中央事件总线
weixin_45688725的博客
12-06 473
在使用Vue框架中，组件之间传值是我们经常使用到的一项技能。比如我们依赖的父组件正向传值给子组件，子组件逆向传值给父组件，兄弟组件之间传值，vuex等，这里我来总结一下中央事件总线的用法。 中央事件总线依赖于$emit实例本身触发事件。 下面就来看一下吧： 在src/assets/下创建一个xxx.js文件在其中只创建一个新的Vue实例，以后它就承担起了组件之间通信的桥梁了，也就是中央事件总线。 在publicBus.js中创建一个新的Vue实例： import Vue from "vue" expo
uniapp中央事件总线
最新发布
04-08
Uniapp中央事件总线是一种用于在不同页面或组件之间进行通信的机制。它允许在应用程序中发布和订阅事件，以实现组件之间的解耦和数据传递。 Uniapp中央事件总线的实现方式通常是通过Vue.js提供的事件总线机制来实现...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值