1.什么是組件通信：

組件（.vue）通過某種方式來傳遞信息以達到某個目的

2.組件通信可以解決什么問題：

每個組件之間都有獨立的作用域，組件間的數據是無法共享的，但在實際開發中我們常常需要讓組件之間共享數據，組件通訊可以讓它們之間能進行通訊，這樣才能構成完整的系統。

3.父子組件通信

3.1 方法一：props / $emit

父組件A通過props的方式向子組件B傳遞，B傳A通過在B組件中$emit,A組件中v-on的方式實現。

3.2 方法二：$children / $parent

$children:獲取到一個包含所有子組件（不包含孫組件）的VueComponent對象數組，可以直接拿到子組件中所有的數據和方法等

$parent: 獲取到一個父節點的VueComponent 對象，同樣包含父節點中所有數據和方法等

3.3 方法三 ：$attrs / $listeners

$attrs:包含父作用域里除class 和 style 外的非props屬性集合。通過 this.$attrs 獲取父作用域中所有符合條件的屬性集合，然后還要繼續傳給子組件內部的的其他組件，通過 v-bind = ' $attrs??'來實現

$listeners :包含父作用域里 .native 除外的監聽事件集合。如果還要繼續傳給子組件內部的其他組件，就可以通過 v-on = ' $linteners'

4.同級組件通信

數據提升：A修改B，把B中的數據提升到公共的父組件里面，A通過子傳父修改父親的數據，父親通過父傳子傳遞把數據傳遞到B

5.跨層級組件通信

vuex全局狀態共享

EventBus中央事件總線

不管是父子組件，兄弟組件，跨層級組件等都可以使用它完成通信操作

定義方法：

1.抽離成一個單獨的js文件 Bus.js ，然后再需要的地方引入

1.1 A / B => import Bus from ' ./Bus.js '

1.2.A=> Bus.$emit(' 自定義事件名',' 傳輸的數據 ')

1.3.B =>Bus . $on (' 自定義事件名' ，function(接收的數據) {})

2.直接掛載到全局 Vue.prototype.$bus = new Vue()使用的時候$bus.

2.1 A=>this.$bus.$emit(' 自定義事件名',' 傳輸的數據 ')

2.2 B=> this.$bus.$on? (' 自定義事件名' ，function(接收的數據) {})

3.注入到Vue根對象上面 new Vue ({data: {Bus:new Vue()})

什么是組件：

組件就是把圖形、非圖形的各種邏輯均抽象為一個'統一的概念（組件）來實現開發的模式，在vue中每一個.vue文件都可以視為一個組件

組件的優勢：

1.降低整個系統的耦合度，在保持接口不變的情況下，我們可以替換不同的組件快速完成需求

2.調試方便，由于整個系統是通過組件組合起來的，在出現問題的時候，可以用排除法直接移除組件，或者根據報錯的組件快速定位問題，之所以能夠快速定位，是因為每個組件之間的低耦合，職責單一，所以邏輯會比分析整個系統要簡單

3.提高可維護性，由于每個組件的職責單一，并且組件在系統中是被復用的，所以對代碼進行優化可以獲得系統的整體升級