vue项目中，使用bus总线后请求叠加问题

最新推荐文章于 2023-11-15 15:00:20 发布
最新推荐文章于 2023-11-15 15:00:20 发布
阅读量289 收藏
点赞数
分类专栏： vue精选 文章标签： bus总线问题 bus总线请求叠加问题 bus总线请求叠加 bus的坑
版权声明：本文为博主原创文章，遵循 CC 4.0 BY 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/louting249/article/details/107847898
版权
本文探讨了在Vue项目中使用bus总线导致的接口请求叠加问题。作者指出，未正确使用off方法取消订阅是问题所在。建议在组件的beforeDestroy或destroyed钩子中移除事件监听，以防止请求堆积。
摘要由CSDN通过智能技术生成

使用bus总线后，发现自己接口请求叠加
然后之后发现自己定义和使用了bus总线，但是都没有off掉

一般地，在$on前$off掉，在beforeDestory或者destoryed也要$off掉

  mounted () {
   
    BusVue.$off('isShowBox')
    BusVue.$on('isShowBox', this.isShowBox)
最低0.47元/天 解锁文章
lt要努力
关注
专栏目录
Vue的总线机制
qq_38402659的博客
02-24 626
非父子组件传值 1,vux 2,发布订阅模式在Vue中称为总线机制,使用Bus实现,又称为观察者模式 Vue.prototype.bus=newVue()在Vue的原型对象上绑定一个Bus属性，这个属性的值是一个Vue实例,这个实例上有bus = new Vue() 在Vue的原型对象上绑定一个Bus属性， 这个属性的值是一个Vue实例,这个实例上有bus=newVue()在Vue的原型对象上绑定...
事件总线：vue中$bus的使用和涉及到的问题(兄弟组件之间传值)
bigdargon的博客
12-12 794
$bus传值
vue bus 兄弟组件传值依次累加
Thekingyu的博客
06-27 756
使用$emit都会建立的一个新的消息机制，而组件销毁时这个消息机制一直未被销毁。不停的切换页面，会不断的挂载和销毁组件，如果每切换一次页面就点一次按钮，就会创建一个新的消息机制，不断的创建而不销毁，导致B组件接受事件里的操作重复触发 beforeDestroy() { this.bus.$off(); }, 每次跳转最后清除bus，就不会出现以上问题，需加在传值页面a传b...
vue中一个页面引入多个相同组件重复请求的问题？
最新发布
qq_43631129的博客
11-15 2622
vue中一个页面引入多个相同组件重复请求的问题？
vue中$bus的使用和涉及到的问题
Liingot的博客
06-02 1万+
Hello大家周末好，最近项目比较忙所以没有及时的更新抱歉，今天给大家讲一vue.bus。使用过的都知道$bus是兄弟之间相互传值的项目中说实话用的地方不算多但是也会用到（每一个领域都是会有坑的呀）。 1：创建$bus文件 创建一个文件内容如下：import Vue from 'vue' export default new Vue(); 2...
vue中组件叠加显示
weixin_45928161的博客
03-20 6089
提示：只提供简单可行的方案，没有深入研究，本意是记录一下成果 假设A组件要叠加在B组件上显示，效果如下图： 我们只需要将A组件进行如下设置： 设置A组件的宽高，使用px为单位 A组件与B组件只作为首页的一部分进行引入显示，所以在首页vue文件，再对A组件进行设置，关键点： 使用absolute进行绝对定位，自行设置该组件显示在哪里 z-index：可以理解为叠加显示的优先级，数值高的叠在数值低的上方显示 如果只存在两个组件叠加显示，则被叠加的组件无需进行设置 ...
vue——bus总线的使用
想好了再写！
08-18 360
1.在src目录下创建一个utils文件，在该文件夹下面创建一个bus.js（名字自定义） 2.在bus.js写入以下代码 import Vue from 'vue'; export default new Vue() 3.在要的组件中引入 在Mine.vue和Shop-carz.vue中引入 Mine.vue给Shop-carz.vue传值,说明如下图： 在created生命周期接受传递过来的数据 ...
vue的bus总线
qq_45894929的博客
07-09 114
1.安装bus npm install vue-bus 2.main.js引入bus import VueBus from 'vue-bus'; Vue.use(VueBus); 3.触发事件 this.$bus.emit("setting", 9); 4.监听事件 created() { this.$bus.on("setting", (data) => { this.current = data; }); }, 5.销毁事件 destroyed()
Vue BUS总线
qq_42345237的博客
12-22 3616
Vue Bus 总线 作用：在vue中实现非父子组件之间通信。 场景：bus适合小项目、数据被更少组件使用，或者数据量少的项目。 本质：实际上是一个发布订阅者模式的使用，利用 vue 的自定义事件机制，在触发时通过 $emit 向外发布一个事件，而在需要使用的页面，通过 $on 监听事件或者说是注册事件。是一个不具备DOM的组件。它就像是所有组件共用相同的事件中心，用它来作为沟通桥梁，可以向该中心注册发送事件或接收事件。 实现： 使用一个空的 Vue 实例(bus.js)作为中央事件总线。 // bus
vue Bus总线
SilenceJude的博客
11-24 397
vue Bus总线 有时候两个组件也需要通信（非父子关系）。当然Vue2.0提供了Vuex，但在简单的场景下，可以使用一个空的Vue实例作为中央事件总线。 参考：http://blog.csdn.net/u013034014/article/details/54574989?locationNum=2&fps=1 例子：https://segmentfault.com/q/10100000...
Vue3 bus 事件总线解决兄弟组件传参、不同层级组件传参
qq_51574759的博客
02-09 2443
Vuex 和 Pinia 都是 vue 中常用的状态管理解决方案。但是他们主要都是用来解决不同组件公用参数或存放重要参数的，将其作为传参的方式，未免有些不妥和浪费，所以我们还可以使用另一种方式进行组件之间的传参：事件总线 bus
Vue全局事件总线
qq_67519713的博客
11-05 734
全局事件总线
vue中bus的用法及bus.$on重复触发问题总结
weixin_44900104的博客
11-04 3270
vue中bus的用法及bus.$on重复触发问题总结
vue项目之axios请求统一配置了超时时间，单独接口请求时重设超时时间
牛先森家的博客
08-02 1万+
vue项目中axios请求统一配置了超时时间，单独接口请求时重设超时时间 根据官网推荐：axios配置官网 默认请求时间接口请求： // 任务新建 export function newTaskAdd(data) { return request({ url: '/api/taskPlan/add', method: 'post', data }) } 重设超时时间的接口请求： // 任务新建 export function newTaskAdd(data) {
vue中总线机制(bus)
海阔天空
12-07 7993
vue中非父子组件之间通信除了使用vuex，也可以通过bus总线，两者适用场景不同。 bus适合小项目、数据被更少组件使用的项目，对于中大型项目 数据在很多组件之间使用的情况 bus就不太适用了。bus其实就是一个发布订阅模式，利用vue的自定义事件机制，在触发的地方通过$emit向外发布一个事件,在需要监听的页面，通过$on监听事件。 vuex适用中大型项目、数据在多组件之间公用的情况。 ...
消息总线Bus基本概念与实操配置
bad_boy的博客
09-17 1415
BUS 概述 分布式自动刷新配置功能（与Config结合使用） 支持两种消息代理：RabbitMQ和Kafka 基本原理： ConfigClient实例都监听MQ中同一个topic（默认是SpringCloudBus），当一个服务刷新数据的时候，它会把信息放到Topic中，这样其他监听同一个Topic的服务就能得到通知，然后更新自身的配置。 动态刷新全局广播 利用消息总线触发一个客户端/bus/refresh，由客户端刷新所有客户端（破坏了微服务的单一职责性，各节点的对等性） 利用消息总线出发一个服务
Vue 2.0中使用EventBus接收消息后发起多次请求的问题解决
越陌度阡
12-01 1311
两个兄弟组件，需要进行消息通信，当一个组件收到消息后会发起请求，正常情况下只会请求一次数据，实际项目中经常会遇到连续发起多次请求的问题。 定义事件总线： 第一个组件里发送消息： 第二个组件里接收消息： 解决多次请求的关键就在于，要进行事件解绑，也就是下面这行代码。 .........
vue解决一个方法同时发送多个请求
热门推荐
狂野的心跳的博客
07-20 2万+
在项目开发过程中，让人抓狂之一的问题就是一个点击事件，当快速点击的时候，它会重复发送多个请求。这是不允许出现的。 但是怎么解决这个问题呢？ 一般处理方法，就是点击的时候，立刻将该按钮disabled，这样就可以避免重复发送请求了。但是我发现这个有一个弊端，那就是： 如果，该事件有许多的验证，比如电话、邮箱格式是否正确呀，必填的是否填了呀等等。一旦你点击就把按钮disabled了，发现该填的没...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值