bus中央事件总线

最新推荐文章于 2024-07-23 16:37:55 发布
最新推荐文章于 2024-07-23 16:37:55 发布
阅读量732 收藏 1
点赞数
分类专栏： Vue 文章标签： vue 前端 javascript
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/Sue_Vivian/article/details/106021501
版权

公交事件总线bus ,指的是一个空的Vue实例， bus=new Vue({}),用于组件之间的 简单通信。
一、$emit
1、bus $emit（‘自定义事件名’,要传送的数据）；触发当前实例上的事件，要传递的数据会传给监听器。

二、$ on
1、bus. o n ( ′ 事 件 名 ′ , c a l l b a c k ) − − − − − − − − − − − − − − − − − − − − c a l l b a c k 回 调 on('事件名',callback) --------------------callback回调 on(′事件名′,callback)−−−−−−−−−−−−−−−−−−−−callback回调emit要传送的数据；
eg：routerJsonChange 这个事件是实例自带的。bus._events打印结果中包含routerJsonChange这个事件，需要用 $on 触发
2、监听当前实例上自定义事件；

Sue_9293
关注
专栏目录
简易使用Vue中的中央事件总线(eventBus)
u013493822的博客
09-04 1585
前言 正如我们所知Vue中组件的通信场景很多, 什么跨多级父子通信, 兄弟通信等等。各种各样的解决方法网上方法都有以及多得飞起, 我就不复制黏贴, 省点ATP。在Vue生态中已经有很好的方案解决各种疑难杂症的通信问题, 针对中大型项目, 首选Vuex (用过都说好),但是如果是小型项目使用Vue的eventBus, 是一个不错的选择。我们接下来简单说下Vue的事件总线的使用和一些常见的问题。 ...
Vue 中央事件总线的坑
grootbaby
09-04 1791
两个问题： 问题1： 为什么第一次触发的时候页面B中的on事件没有被触发 问题2： 为什么后面再一次依次去触发的时候会出现，每一次都会发现好像之前的on事件分发都没有被撤销一样，导致每一次的事件触发执行越来越多。 问题一 第一次触发的时候页面B中的on事件没有被触发 产生原因 当我们还在页面A的时候，页面B还没生成，也就是页面B中的 created中所监听的来自于A中的事......
Vuejs的事件总线bus
08-08
Vue.js的事件总线bus
Vue-中央事件总线（bus）
qq_56973906的博客
09-09 3591
通过创建一个新的vm对象,专门统一注册事件,供所有组件共同操作,达到所有组件随意隔代传值的效果也就是：各个组件内部要传输的数据或者要执行的命令信息，靠bus来通信。我们知道子组件向父组件传值可以通过将自定义事件的方法来进行，那么如果我们把事件绑定在所有组件都能访问的地方，然后想要给某个组件通信，直接触发这个事件。//1.触发x组件的a事件: x.$emit("a事件",参数...)//2.给x组件绑定a事件 x.$on("a事件",监听器函数)
Vue事件总线（EventBus）的概念、使用以及注意事项
最新发布
weixin_53216033的博客
07-23 1104
在Vue开发中，组件间的通信是不可避免的需求。对于父子组件间的通信，Vue提供了props和$emit/$on等内置机制。然而，当需要在非父子关系的组件间进行通信时，这些内置机制就显得力不从心了。这时，Vue事件总线（EventBus）作为一种灵活的解决方案应运而生啦。本篇文章将详细讲解Vue事件总线的原理、安装、使用及最佳实践，帮助大家更好地去理解和应用这一技术。
bus事件总线
congboer的博客
11-17 414
// bus.js import Vue from 'vue'; export default new Vue(); // main.js import $bus from 'bus.js' Vue.prototype.$bus = $bus; // 父组件 this.$bus.$emit('eventName','参数') // 子组件 this.$bus.$on('eventName',function() { // 一些操作 })
【Vue项目】 bus事件总线
Allen_Sushi首页
11-17 1982
Vue2 bus事件总线的原理与使用
Vue中央事件总线bus
weixin_39205240的博客
04-19 582
大家都知道，一个 ，可以作为一个简单的组件传递数据，用于解决跨级和兄弟组件通信问题，那么，这篇文字，我将使用这种思想，将bus封装为一个Vue的插件，可以在所有的组件间任意使用，而不需要导入bus。 首先，我们使用vue-cli创建一个项目vue-bus, 在src目录下，新建vue-bus.js文件，vue-bus插件像vue-router 和 Vuex一样，给Vue对象添加一个属性$bus...
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）。 该插件实现了非亲子...
vue2事件总线event bus
青山不改，绿水长流。
09-26 1081
vue2事件总线event bus。
uniapp中央事件总线
04-08
Uniapp中央事件总线是一种用于在不同页面或组件之间进行通信的机制。它允许在应用程序中发布和订阅事件，以实现组件之间的解耦和数据传递。 Uniapp中央事件总线的实现方式通常是通过Vue.js提供的事件总线机制来实现...
事件总线EventBus
yangguosheng的专栏
11-19 6493
什么事件总线，又“总”在何处。事件总线的简单实现。
Vue之中央事件总线bus
weixin_48842132的博客
01-18 1134
快速上手使用中央事件总线bus解决兄弟组件和跨多级组件通信问题
事件总线（GlobalEventBus）
qq_45121945的博客
06-01 463
大白话版本的事件总线
bus事件总线 使用
han_xiao_xiao的博客
08-05 371
路由bus事件总线
Android EventBus实战
热门推荐
Dream It Possible
11-06 1万+
1、概述 最近大家面试说经常被问到EventBus，github上果断down了一份，地址：https://github.com/greenrobot/EventBus，的确是个不错的框架，主要用于事件的发布和订阅。 EventBus定义：是一个发布 / 订阅的事件总线。 这么说应该包含4个成分：发布者，订阅者，事件，总线。 那么这四者的关系是什么呢？ 很明显：订阅者
vue中央事件总线 eventBus
chenxiaoyu97的博客
07-05 543
创建一个新的Vue实例，以后它就承担起了组件之间通信的桥梁了，也就是中央事件总线。 1.新建一个文件夹用来容纳中央事件总线这个vue实例 // 中央事件总线就是新建一个vue实例用来当兄弟组件的数据桥梁 import Vue from "vue" export default new Vue() 2 兄弟传值 demoa需要把数据给demob （1）现在demoa中使用$emit()把数据通过自定义事件绑定到那个vue实例上\ <template> <div> ..
中央事件总线
Drizzlejj的博客
05-19 592
公共事件总线eventBus的实质就是创建一个vue实例，通过一个空的vue实例作为桥梁实现vue组件间的通信。它是实现非父子组件通信的一种解决方案。 用法如下： 第一步：项目中创建一个js文件（我通常给它取个名字为bus.js），引入vue，创建一个vue实例，导出这个实例，代码如下（一共就两行）： import Vue from 'Vue' export default new Vue 第二步：在两个需要通信的两个组件中分别引入这个bus.js import Bus from '这里是你.
Vue开发中的中央事件总线EventBus
u011200562的博客
07-29 701
使用背景：　　 在Vue开发中会遇到大量的组件之间共享数据的情形，针对不同的情形，Vue有相对应的解决方案。比如，父组件向子组件传值可以使用props，复杂项目中不同模块之间传值可以使用Vuex。但是，对于一些简单的项目里的非父子组件来说，它们一方面不适用props，另一方面又没有必要使用Vuex，针对这种情形可以使用中央事件总线（Event Bus）来解决问题。 1、创建中央事件总线 可以使用多种形式创建Event Bus。 Example 1： // main.js import Vu...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值