vue之全局事件总线$bus

、、、、、、、、、、、仅对以前所学做复习记录使用、、、、、、、、、

全局事件总线是组件间的一种通信方式,适用于任意组件间通信。

主要原理是根据VueComponent.prototype.__ proto__ = Vue.prototype来进行全局应用。

1、安装事件总线
在vue实例中写入beforeCreate

  beforeCreate(){
	  Vue.prototype.$bus = this
  }

在这里插入图片描述
其中的bus是个约定俗成的名字,你也可以起其他名字。
this指向vue实例。

共有两个组件:app和school
1、school向app传递数据
传递数据用emit
在这里插入图片描述

2、app接收school传来的数据
接收数据用on
在这里插入图片描述

this.$bus.$on('gaiming', data => {
			console.log(data);
		});

接收的函数要用箭头函数,this指向VueComponent;
如果是普通函数则指向Vue函数

3、结果:
在这里插入图片描述

  • 3
    点赞
  • 7
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值