$emit和$on(bus.$on)

一、$emit
1、this $emit('自定义时间名',要传送的数据);
2、触发当前实例上的时间,要传递的数据会传给监听器;

二、$on
1、VM.$on('事件名',callback)    --------------------callback回调$emit要传送的数据;
2、监听当前实例上自定义时间;

经典案例:

子组件:
$emit和$on(bus.$on)_第1张图片
$emit和$on(bus.$on)_第2张图片
父组件:
$emit和$on(bus.$on)_第3张图片
$emit和$on(bus.$on)_第4张图片
这里需要强调的一点是:on和emit事件必须是在一个公共的实例上才能触发。
一定要记住你们可以使用一个空的 Vue 实例作为中央事件总线。别一个在二次元,一个在三次元。
$emit和$on(bus.$on)_第5张图片

$emit和$on的事件必须在一个公共的实例上,才能够触发。

经典案例:
首先在main.js里新加bus作为一个公共的实例
$emit和$on(bus.$on)_第6张图片
$emit和$on(bus.$on)_第7张图片
$emit和$on(bus.$on)_第8张图片

你可能感兴趣的:(前端)