vue 父子组件和兄弟组件之间的数据传递问题

Question

我们知道可用props从父组件向子组件传递数据
也可用在父组件上绑定一个自定义事件，然后在子组件内emit触发事件，到达从子组件向父组件传递数据的目的。

但是如果我们要实现简单的兄弟组件间的通信，比如途中组件1和组件2的通信。

实际中是这样

组件1选择好地址后 会在地图上maker一个点， 然后计算出路程事件和距离显示在组件一中。

如果数据传递是通过 先传给父组件再从父组件下发给子组件是不是稍显麻烦。
有什么好的思路请指教

Answer 1

你可以用bus来解决。

var bus = new Vue()

// 触发组件 A 中的事件
bus.$emit('id-selected', 1)

// 在组件 B 创建的钩子中监听事件
bus.$on('id-selected', function (id) {
  // ...
})

官方文档 - 非父子组件通信

Answer 2

项目组件间交互比较复杂建议引入vuex，不是特别复杂就可以共用同一个vue对象，用$emit和$on操作