vue $on 和 $emit 的使用

要在父子组件间调用（在一个公共的实例上才能触发），我的理解就是要先存在$on()，再触发$emit()。

$on：监听当前实例上的自定义事件。事件可以由vm.$emit触发。回调函数会接收所有传入事件触发函数的参数。

$emit：触发当前实例上的事件。附加参数都会传给监听器回调。

监听自定义事件要在事件执行前被监听

执行顺序： 监听自定义事件-->触发自定义事件-->触发监听结果

先新建bus.js

import Vue from 'vue'

export var bus = new Vue()

 

比如在App.vue全局页面中先注册监听器：

import bus from 'bus.js'
// ...

bus.$on('success', (e) => {
    alert(e)
});

然后在App.vue中调用的页面home.vue中触发：

import bus from 'bus.js'
// ...

bus.$emit('authSuccess','11111');

所以每次刷新主页的时候都会alert(11111)