推荐一个仓库。地址:https://github.com/tangdaohai...
在 vue3 版本中删除了 $on/$once/$off
API (see),不过不用担心,可以使用此仓库作为替代方案,继续使用 event bus 的方式来实现跨组件的通信功能,并且不用手动去 $off 事件回调。
vue-happy-bus
是一款基于vue3实现的订阅/发布
插件。
在 vue 中,我们可以使用 event bus 来实现 跨组件间通信
。但一个弊端就是,这种方式并不会自动销毁,所以为了避免回调函数重复执行,还要在 onUnmounted
中去移除回调函数。
这样带来的冗余代码就是:
- $on 的回调函数必须是具名函数。不能简单的
$on('event name', () => {})
使用匿名函数作为回调,因为这样无法销毁事件监听,所以一般采用具名函数
作为回调 - 在
onUnmounted
生命周期中去销毁事件的监听。
我只是想在某个路由中监听下 header 中一个按钮的点击事件而已,竟然要这么麻烦???
所以此轮子被造出来了 。
它主要解决在夸组件间通信时
,避免重复绑定事件、无法自动销毁的而导致回调函数被执行多次
的问题。
总得来说他是能让你偷懒
少写代码的工具。
详细使用文档见此处),不过不用担心,可以使用此仓库作为替代方案,继续使用 event bus 的方式来实现跨组件的通信功能,并且不用手动去 $off 事件回调。
vue-happy-bus
是一款基于vue3实现的订阅/发布
插件。
在 vue 中,我们可以使用 event bus 来实现 跨组件间通信
。但一个弊端就是,这种方式并不会自动销毁,所以为了避免回调函数重复执行,还要在 onUnmounted
中去移除回调函数。
这样带来的冗余代码就是:
- $on 的回调函数必须是具名函数。不能简单的
$on('event name', () => {})
使用匿名函数作为回调,因为这样无法销毁事件监听,所以一般采用具名函数
作为回调 - 在
onUnmounted
生命周期中去销毁事件的监听。
我只是想在某个路由中监听下 header 中一个按钮的点击事件而已,竟然要这么麻烦???
所以此轮子被造出来了 。
它主要解决在夸组件间通信时
,避免重复绑定事件、无法自动销毁的而导致回调函数被执行多次
的问题。
总得来说他是能让你偷懒
少写代码的工具。
详细使用文档见此处
**粗体** _斜体_ [链接](http://example.com) `代码` - 列表 > 引用
。你还可以使用@
来通知其他用户。