您的位置:首页 > 产品设计 > UI/UE

Vue兄弟组件之间的通信(EventBus)

2017-08-08 15:17 661 查看
在开发中,不可避免的要碰到需要兄弟组件之间相互通信的地方,在Vue的1.0版本中,我曾经采取的方式是通过两个兄弟组件的共同父级进行通信。主要用到$dispatch和$broadcast这两个方法。但在如今的2.0版本中 ,这两个方法已经废弃,而且在我看来依靠这种方式来实现本身也不够优雅。
所幸2.0版本中为我们提供了新的实现方式。下面就来简单介绍下这种方式,即EventBus

var bus = new Vue()
// 触发组件 A 中的事件
bus.$emit('id-selected', 1)
// 在组件 B 创建的钩子中监听事件
bus.$on('id-selected', function (id) {
// ...
})
其实就是两个组件共享一个Vue的实例,其中一个组件触发事件,另一个组件监听事件后触发回调函数。
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签:  Vue组件 Vue 组件