eventbus注销的事件取消不掉

已于 2022-07-06 09:53:49 修改
阅读量542 收藏
点赞数
分类专栏： js vue es6 文章标签： echarts vue antdv
于 2022-03-04 16:04:20 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_45631278/article/details/123279047
版权
vue 同时被 3 个专栏收录
32 篇文章 1 订阅
订阅专栏
js
15 篇文章 0 订阅
订阅专栏
es6
4 篇文章 0 订阅
订阅专栏

派发事件

add (form) {
  this.EventBus.$on('addSuccess', form);
}

mounted() {
      this.EventBus.$on('event', (form) => {
      console.log(form);
      });
    },
    beforeDestroy() {
      this.EventBus.$off('event');
    }

注意： this.EventBus. o f f ( ′ e v e n t ′ ) ; 不 能 传 参 数 ， t h i s . E v e n t B u s . off('event');不能传参数，this.EventBus. off(′event′);不能传参数，this.EventBus.off(‘event’， {});
是不行的

大家谨慎使用EventBus，如果事件车变多会导致方法名不够用哈，另外一定要在绑定的页面进行off卸载

人间清醒小仙女
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
专栏目录
Vue EventBus事件侦听（$on、$emit、$off、$once）
caoxinjian423的博客
10-09 8259
eventBus.js import Vue from 'vue'; export const EventBus = new Vue(); components/Parent.vue <template> <div> 我是父组件 <Son></Son> </div> </template> <script> /* vm.$on( event, callback )
Android EventBus（普通事件/粘性事件）详解
08-28
在Android开发中，EventBus是一个轻量级的事件总线库，它简化了应用程序组件之间的通信，使得组件之间可以通过发布和订阅事件来进行交互，而无需硬编码回调或使用静态方法。EventBus的主要特点在于它的简单易用和...
eventBus 你不知道的事
shjd_J的博客
10-14 273
我们会发现，当组件A已经触发了事件getSomething的时候，第一次切换到组件B时，控制台会打印一次value的值，也就是1；但是当第二次切换到组件B时，会打印两次1，第三次会打印三次，如此累加，这样就会导致很多问题。法二：在生命周期beforeDestroy里面调用$off卸载掉事件。
Vue：EventBus踩过的坑（重复触发事件，以及上次事件中的遗留数据造成的数据错乱问题），实录
qq_27824793的博客
12-11 1316
EventBus（一）：注册、分发、注销
SuperBin的博客
05-10 2万+
1 EventBus简介EventBus是一个用于简化Andorid、Fragment、Threads、Service之间信息传递的一个发布/订阅事件集。 使用EventBus的建议： 并不建议将应用中所有的事件都通过EventBus进行发送，尤其对于一对一的组件之间通信，建议不要使用EventBus。EventBus的使用场景更像是一种广播，当我们向EventBus发送一个事件，则该事件将会传
Vue.js+VueRouter+Vuex 实现用户登录、注销功能
qq_37236395的博客
11-26 2371
GitHub Vue.js+Vue Router+Vuex实现用户登录、注销功能 登录页面 Login.vue <template> <div class="login"> <input type="text" placeholder="用户名" v-model="loginForm.username"> <input type="text" placeholder="密码" .
【Vue2】全局事件总线$bus
weixin_45707229的博客
09-12 2172
全局事件总线：在main.js中对vue的原型注册好$bus，在父组件中通过this.$bus.$on来注册全局事件，在子组件中通过this.$bus.$emit来调用注册好的事件。
EventBus包jar
最新发布
10-16
EventBus 是一个在 Java 应用程序中广泛使用的发布/订阅事件总线库，尤其在 Android 开发中非常流行。这个“EventBus_jar 包”包含的是 EventBus 的特定版本，即 2.4.0 版本。下面将详细介绍 EventBus 的核心概念、...
EventBus 思想拆解
09-17
3. 事件订阅注册与注销：使用 `EventBus.getDefault().register(this)` 和 `EventBus.getDefault().unregister(this)` 分别进行订阅和注销操作，确保生命周期的正确管理。 4. 异步事件传递：通过事件队列和事件分发...
EventBus3.0
01-31
4. **订阅者生命周期管理**：EventBus 能够自动管理订阅者的生命周期，比如在 Activity 或 Fragment 销毁时自动取消订阅，避免内存泄漏。 5. **事件优先级**：允许设置事件的优先级，确保高优先级的事件先被处理。 6...
EventBus例子
09-15
通过`EventBus.getDefault().postSticky(event)`发布粘性事件，然后在需要时取消粘性事件`EventBus.getDefault().removeStickyEvent(eventClass)`。 以上就是使用EventBus进行Android组件间通信的基本知识。...
vue注销监听，访问更新后的dom 计算属性的set get 常用修饰符
m18697787579的博客
10-23 399
默认情况下，v-model 会在每次 input 事件后更新数据 (IME 拼字阶段的状态例外)。默认情况下，用户创建的侦听器回调，都会在 Vue 组件更新之前被调用。这意味着你在侦听器回调中访问的 DOM 将是被 Vue。在我们更改计算属性时我们需要利用computed的set方法。1.监听中常会改变一些数据导致组件的更新，2.如果我们需要在特定的条件下注销监听。3.通常我们不会去改变计算属性。
Vue事件总线（EventBus）、$on、$emit、$off
热门推荐
^_^
06-29 3万+
在之前我们只用过父传子，子传父进行传数据，这时候当组件嵌套比较深或比较复杂的情况，这时候就用到了事件总线 (EventBus) 如何理解事件总线呢，你可以理解为用来传输数据的一条线 一、使用EventBus 1. 创建事件总线 main.js // 创建事件总线 const bus = new Vue() // 把bus挂载到了Vue的原型上, 保证所有的组件都能通过 this.$bus访问到事件总线 Vue.prototype.$bus = bus 2.页面使用 发布事件 - 传...
组件通信总览
s8806479的博客
09-13 220
文章目录组件通信常用方式propseventbusvuex自定义事件边界情况$parent$children$root$refsprovide/inject非prop特性$attrs$listeners 组件通信常用方式 props eventbus 解决无关系组件之间的交互问题，比如兄弟 如何使用？ //main.js Vue.prototype.$bus = new Vue() //a组件 mounted() { this.$bus.$on('isCalled', this.isCalled) /
事件总线 eventBus 详解
facial_123的博客
09-12 1183
eventBus事件总线详解，使用Vue实例并手撕其内部原理
事件总线（EventBus）,父子、兄弟组件间通信，一个页面调用另一个页面的方法 & 使用eventbus遇到的问题（多次触发、第一次不触发）
金乌的博客
11-25 3438
组件通信时，有时两个组件之间毫无关系，或者他们之间的结构复杂，这时就要用到 vue 中的事件总线 EventBus的概念。EventBus 又称为事件总线。EventBus的用途：1.解决一个页面调用另一个页面的方法2.解决父子组件、兄弟组件间的通信。
Vue事件总线（EventBus）使用指南：详细解析与实战应用
在这里，我分享我的技术心得、项目经验、实用的技术教程、深入的技术分析以及前端开发的最新动态，希望能帮助到更多的人。
05-31 1万+
vue组件非常常见的有父子组件通信，兄弟组件通信。而父子组件通信就很简单，父组件会通过 props 向下传数据给子组件，当子组件有事情要告诉父组件时会通过 $emit 事件告诉父组件。今天就来说说如果两个页面没有任何引入和被引入关系，该如何通信了？如果咱们的应用程序不需要类似Vuex这样的库来处理组件之间的数据通信，就可以考虑Vue中的 事件总线 ，即EventBus来通信。EventBus 又称为事件总线。
什么是Vue中的事件总线机制（EventBus）
bug处理进行时
06-06 2690
Vue事件总线机制 - EventBus 事件总线产生的背景 在vue中最核心的部分就是组件，组件间的通信就是重中之重。通信分为父子组件通信、兄弟组件通信、不相干的组件通信等等多种方式。父级向子级通过props传递数据，子级通过 $emit 向父组件通知事件。但是当两个毫不相关的组件互相通信时应该通过什么来实现呢？ EventBus的简介 EventBus 又称时间总线 ，理解上来讲 EventBus 机制是通知的概念，EventBus作为所有组件共享的事件中心，既可以发送事件也可以接受事件，所有组件都可以
物联网大赛 - Android学习笔记（三）Android 事件处理
杨明金的博客
09-23 1万+
学习目标: 了解事件处理概念 监听事件处理模型 事件与事件监听接口 实现事件监听方式 回调事件处理模型 常见的事件回调方法 Handler类功能与用法 Handler更新程序界面 一、监听概念 再用户操作动作时,需要为用户的动作提供响应机制，这种机制就是事件处理 Android提供两套事件处理机制: >基于监听的事件处理 >基于回调的事件处理 二、事件监听处理模型。 >Event Source(事件源)，事件源通常是各个组件，比如按钮、图片按钮、...
Nuxt2怎么使用eventBus事件总线
04-04
在 Nuxt2 中使用 eventBus 事件总线，可以通过以下步骤实现： 1. 创建一个 eventBus.js 文件 在项目的根目录中，创建一个 eventBus.js 文件，代码如下： ```javascript import Vue from 'vue'; export const eventBus = new Vue(); ``` 这里使用了 Vue 的实例来创建 eventBus，并且将它导出，这样就可以在项目中的任何地方使用它了。 2. 在需要使用 eventBus 的组件中引入 eventBus 在需要使用 eventBus 的组件中，可以使用以下代码来引入 eventBus： ```javascript import {eventBus} from '@/eventBus.js'; ``` 这里的 @ 表示项目的根目录，如果 eventBus.js 文件不在根目录中，那么需要改成相应的路径。 3. 使用 eventBus 发送事件 在需要发送事件的地方，可以使用以下代码来发送事件： ```javascript eventBus.$emit('eventName', data); ``` 这里的 eventName 是事件的名称，data 是传递的数据。 4. 使用 eventBus 监听事件 在需要监听事件的地方，可以使用以下代码来监听事件： ```javascript eventBus.$on('eventName', (data) => { // 处理事件 }); ``` 这里的 eventName 是事件的名称，data 是传递的数据。事件触发后，会执行回调函数中的代码。 总结： 以上就是在 Nuxt2 中使用 eventBus 事件总线的方法，通过使用 eventBus，可以在组件之间方便地进行通信。需要注意的是，eventBus 的使用需要谨慎，过多的使用可能会导致代码的可读性和维护性降低。

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

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

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

人间清醒小仙女

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

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

余额充值