參考文章 :https://www.cnblogs.com/yszblog/p/10135969.html
1 父傳子
子組件Vue
父組件
注冊子組件
- 子組件在props中創建一個屬性，用以接收父組件傳過來的值
- 父組件中注冊子組件
- 在子組件標簽中添加子組件props中創建的屬性
- 把需要傳給子組件的值賦給該屬性
2 通過$emit 子組件向父組件傳值
2.1 子組件Vue
2.2 父組件
2.3 父組件監聽子組件發射的事件名
- 子組件中需要以某種方式例如點擊事件的方法來觸發一個自定義事件
- 將需要傳的值作為$emit的第二個參數，該值將作為實參傳給響應自定義事件的方法
- 在父組件中注冊子組件並在子組件標簽上綁定對自定義事件的監聽
在通信中，無論是子組件向父組件傳值還是父組件向子組件傳值，他們都有一個共同點就是有中間介質，子向父的介質是自定義事件，父向子的介質是props中的屬性。抓准這兩點對於父子通信就好理解了
3 兄弟，父子，同級間傳值
利用總線方式可以平級組件進行通信
無論是父向子傳值還是子向父傳值，都需要一個中間介質。對於平級組件來說其實也一樣，他們也需要一個中間介質來作為一個中央事件總線,
一 .我們先來創建中央事件總線，在src/assets/下創建一個eventBus.js,內容如下
eventBus中我們只創建了一個新的Vue實例，以后它就承擔起了組件之間通信的橋梁了，也就是中央事件總線。
二 . 創建一個firstChild組件，引入eventBus這個事件總線，接着添加一個按鈕並綁定一個點擊事件
三 . 我們再創建一個secondChild組件，引入eventBus事件總線，並用一個p標簽來顯示傳遞過來的值
我們在mounted中，監聽了userDefinedEvent,並把傳遞過來的字符串參數傳遞給了$on監聽器的回調函數
PS:
mounted:是一個Vue生命周期中的鈎子函數，簡單點說就類似於jquery的ready，Vue會在文檔加載完畢后調用mounted函數。
$on:監聽當前實例上的自定義事件(此處當前實例為bus)。事件可以由$emit觸發，回調函數會接收所有傳入事件觸發函數($emit)的額外參數。
四 . 在父組件中，注冊這兩個組件，並添加這兩個組件的標簽
總結：
- 創建一個事件總線，例如demo中的eventBus，用它作為通信橋梁
- 在需要傳值的組件中用bus.$emit觸發一個自定義事件，並傳遞參數
- 在需要接收數據的組件中用bus.$on監聽自定義事件，並在回調函數中處理傳遞過來的參數