10-this.$emit和this.$on 什么玩意？
爸爸组件：在一个组件中用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吧。
爸爸组件：
儿子组件：
