vue中兄弟组件传值event bus被多次触发以及踩过的坑

标签：vue bus 点击 销毁 事件 组件 event 传值

传值方式：兄弟组件传值的时候，使用的是 this.$bus.$emit 触发事件和this.$emit.on 监听事件。

业务bug：点击按钮切换兄弟组件，再切换的过程$eventBus出发了多次。

原因：

事件订阅是通过$eventBus对象完成的 与组件无关

后果:如果不移除事件监听 并且会造成内存泄漏

 

分析：

1.当点击销毁子组件的时候 子组件还能接收到数据吗？对应的回调函数还能在执行吗？

答案是 会，事件订阅功能是$eventBus对象完成的，与组件无关，当你点击销毁后 再点击创建又会多了一个订阅事件，依次类推每次点击新建后都会多一个订阅事件。

通过v-if 销毁和重新创建来看通过数据发现 销毁后并没有对空间进行释放

解决方案： 在子组件销毁后进行取消订阅事件

 destroyed() {         this.$bus.$off('事件名称') }

标签：vue,bus,点击,销毁,事件,组件,event,传值
From： https://www.cnblogs.com/zhaohui9527/p/17118944.html