爸爸組件：在一個組件中用this.$emit和this.$on
爸爸組件中引入了兒子組件和孫子組件，並且兒子組件套着孫子組件（因為兒子組件中用了slot）
1 <template>
2 <div class="father">
3 <div>我是爸爸組件</div>
4 <el-button size="small" @click="lookMySelf">看看</el-button>
5 <hr>
6 <Son>
7 <Grandson></Grandson>
8 </Son>
9
10 </div>
11 </template>
12
13 <script>
14 import Son from './son'
15 import Grandson from './grandson'
16 export default { 17 watch:{ 18 // msg(val){
19 // console.log(val);
20 // }
21 }, 22 data(){ 23 return{ 24 msg:'lookFlag是我傳遞的標志,我現在是要發送過去的標志'
25 } 26 }, 27 // 其實無非這種寫法就是在created中去$on訂閱，methods中$emit發射事件，並可以傳值
28 // 因為methods在組件初始化時候就已經定義,data也一樣。
29 // 所以在created時候就能獲取到$emit的值。
30 // 這其實就是在一個組件內分不同階段去監聽數據變化，其實完全可以用watch也能做到
31 methods:{ 32 lookMySelf(){ 33 this.$emit('lookFlag',this.msg); 34 // this.msg='我變了' //用watch去監聽即可拿到改變的值
35 }, 36 getDataFn(data){ 37 console.log('我收到了我自己傳遞給我自己的數據：',data); 38 } 39 }, 40 created(){ 41 this.$on('lookFlag',this.getDataFn) 42 }, 43 components: { 44 Son, 45 Grandson 46 }, 47 } 48 </script>
49 <style>
50 .father{ 51 padding: 30px; 52 } 53 </style>
兒子組件son：
1 <template>
2 <div>
3 <div>我是兒子組件</div>
4 <slot></slot>
5 </div>
6 </template>
7
8 <script>
9 export default { 10 methods: { 11 getGrandSonMsg(data){ 12 console.log(data); 13 } 14 }, 15 created(){ 16 this.$on('tell',this.getGrandSonMsg) 17 }, 18 } 19 </script>
孫子組件：
1 <template>
2 <div>
3 我是孫子組件 4 <el-button size="small" @click="btnFn">傳遞</el-button>
5 </div>
6 </template>
7
8 <script>
9 export default { 10 props: { 11
12 }, 13 data() { 14 return { 15 msg:'我是孫子組件的msg'
16 } 17 }, 18 methods: { 19 btnFn(){ 20 // 因為是grandson組件在son組件中顯示是以插槽的形式，所以
21 /*
22 <son> 23 <grandson></grandson> 24 </son> 25 */
26 // 這種可以嵌套寫，因為被son組件嵌套了，所以$emit給自己(其實也是給son組件插槽中的自己)
27 // 需要多加一個$parents
28 this.$parent.$emit('tell',this.msg) 29 }, 30
31 }, 32 } 33 </script>
總結：這種就是在一個組件中利用生命周期的執行順序，在methods中去發送數據，在created中去拿到數據，暫時沒想到應用場景，因為用watch完全可以去做。
像上面的兒子組件開了一個插槽，為了嵌套孫子組件，這樣孫子組件就是兒子組件中的那個插槽。那么孫子組件想要給自己發送數據$emit，其實就可以在兒子組件中去$on了（因為兒子組件的插槽就是孫子組件，也相當於是他自己）
同樣，我們使用沒有slot的，也就是在兒子組件中去emit事件給爸爸組件，爸爸組件也能收到。收到的前提也是需要兒子組件用this.$parent.$emit去發送才可以，必須$parents才能找到爸爸。其實這就像是直接在爸爸組件上@了兒子組件傳遞來的事件，是兩種寫法，一毛一樣。更簡單了就是語法糖.sync了。
總的來說就是可以自己在自己組件里玩，如果父子通信，就跟普通的emit一樣，只不過寫法不一樣，並且需要this.$parent找到父級再去emit，如果不是父子關系，那么就用EventBus吧。
爸爸組件：
兒子組件：
