组件自定义事件

1. 一种组件间通信的方式，适用于 自组件 ===> 父组件

2. 使用场景：A 是父组件，B是子组件，B 想给 A 传数据，那么就要在 A 中 B 绑定自定义事件（事件的回调在 A 中）

3. 通过父组件给子组件传递函数类型的 props 实现：子给父传递数据

   父组件：

   `<School :getSchoolName="getSchoolName"></School>`
   

   子组件：

   export default{
   
           name:"School",
   
           props:['getSchoolName']
   
       }

4. 绑定自定义事件：

   1. 第一种方式，在父组件中：

   2. <Demo @atguigu='test'/> 或 <Demo v-on:atguigu='test'/>

       

5. 第二种方式，在父组件中：

   <Demo ref='demo'/>
   
   ........
   
   mounted(){
   
   this.$refs.xxx.$son('atguigu',this.test)
   
   }

   c. 若想让自定义事件只能被触发一次，可以使用 once 修饰符，或 $once 方法

6. 触发自定义事件：this.$emit('atguigu',数据)

7. 解绑自定义事件： this.$off('atguigu')

8. 销毁 xxx 组件实例： 销毁当前 xxx 组件实例，销毁后 xxx 实例的自定义事件全都不奏效

9. this.$destroy()

10. 组件上也可以绑定原生 DOM 事件，需要使用 native 修饰符

11. 注意：通过 this.$refs.xxx.$on('atguigu',回调)绑定自定义事件时，回调要么配置在 methods 中，要么用箭头函数。否则 this 指向会出问题！