vue bus传参

新建一个js文件,命名为bus.js。bus.js文件的内容为:

import Vue from 'vue'
const bus = new Vue()
export default bus 

页面demo.vue包含两个组件 a.vue和b.vue
a.vue执行一个事件,传递数据到b.vue 或者b.vue执行一个事件,传递数据到a.vue
举例:a.vue执行事件传递数据到b.vue:
首先:
在a.vue和b.vue分别引入bus.js
其次:
发送信息:

import bus from '@/utils/bus'

a.vue执行事件($emit 发布命令)
第一个参数为标志变量,第二个参数为通信的值

aClick(item){
	bus.$emit('tellB',item)
}

接收信息:

import bus from '@/utils/bus'

b.vue接收事件($on 接收命令)
第一个参数为标志变量,第二个参数中的item为通信的值

bus.on('tellB',item => {
	//执行你的操作
})

最后 要进行销毁

destroyed(){
	bus.$off('tellB') //这步操作为  卸载这个命令  不写的话,$on事件就会重复执行   有多少事件就卸载多少个
}
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值