1、因为需要进行多次传值,所以在发送方,发送过数据之后就要立即进行销毁,从而不影响下一次数据的发送,接收方在转义赋值之后,也要对接收方的自定义事件进行销毁,不妨碍接受下一次的数据
发送方:
在发送完数据之后就进行数据的销毁
async editGoodsInfo(id) {
this.$router.push('/editGoods')
this.editFormId = id
const { data: res } = await this.$http.get('goods/' + id)
if (res.meta.status !== 200) {
console.log(res)
return false
}
// 因为需要进行多次传值,所以在发送方,发送过数据之后就要立即进行销毁,从而不影响下一次数据的发送,接收方在转义赋值之后,也要对接收方的自定义事件进行销毁,不妨碍接受下一次的数据
bus.$emit('share', res.data)
bus.$off('share')
}
接收方:
此处是将数据进行了简单的处理,在数据处理结束之后,并且已经将接收到的值转接给另一个变量的时候,就把接收方的自定义事件 'share' 移除
bus.$on('share', (dd) => {
const newArr = []
dd.goods_cat.split(',').forEach((item) => {
item = parseInt(item)
newArr.push(item)
})
if (newArr.length !== 3) {
console.log('err')
return false
}
dd.goods_cat = newArr
this.addGoodsForm = dd
bus.$off('share')
})
}
中转:
import Vue from 'vue'
// 新建一个实例分享出去
export default new Vue()
此处引用了一篇间的兄弟组件通信的文章,可以自行跳转观看