Vue兄弟組件通訊的三種方式

1、子傳父，而後父傳子

2、Vuex

3、建立一個事件總線

前兩種方式官方文檔十分詳盡再也不贅述，只在這裏簡述一下第三種方式的思路。
由於$on和$emit的事件必須是在一個公共的實例上才能觸發。那麼咱們能夠新建一個Vue實例看成事件總線，達到能夠無論組件之間的父子關係，都能經過這個實例通訊的目的

一、新建eventBus.js

import Vue from 'vue'

export default new Vue()

二、Component1.vue裏監聽事件

import eventBus from './eventBus'
//...
created () {
  eventBus.$on('my-event', args => {
  //...
  }) 
}

三、Component2.vue中觸發事件

import eventBus from './eventBus'
//...
watch: {
  list(newValue, oldValue) {
    eventBus.$emit('my-event', newValue)
  }
}

4、完