vue中$refs, $emit, $on, $once, $off的使用详解

1.$refs的使用场景

父组件调用子组件的方法，可以传递数据。
父组件：

  
  点击父组件

 

子组件：

2.$emit的使用

子组件调用父组件的方法并传递数据。

子组件：

父组件：

3.$on的使用场景

兄弟组件之间相互传递数据。
首先创建一个vue的空白实例（兄弟组件的桥梁）

import vue from 'vue';
export default new vue();

子组件a:发送放使用$emit自定义事件把数据带过去。

子组件b:接收方通过$on监听自定义事件的callback接收数据

父组件：

4.$once的使用场景

监听一个自定义事件，但是只触发一次。一旦触发之后，监听器就会被移除。
将on变成once，即只执行一次。

 eventbus.$once('aevent',(val)=>{
        console.log(val);//打印结果；我是a组件的数据。
      })

5.$off的使用场景

移除自定义事件监听器，语法：vm.$off( [event, callback] )
如果没有提供参数，则移除所有的事件监听器；（注意这条，一般在main.js中，移除所有事件绑定）
如果只提供了事件，则移除该事件所有的监听器；
如果同时提供了事件与回调，则只移除这个回调的监听器。

eventbus.$off()
eventbus.$off('aevent')
eventbus.$off('aevent',callback)