使用目的
实现组件之内的通信,也就是传递数据
适用范围
兄弟组件传值、爷孙组件传值、封装组件的时候要所有被调用的这个组件同时响应实现一些功能的时候
使用范例
新建js文件 eventBus.js
内容为一个vue实例
import Vue from 'vue'
export default new Vue()
如果全局调用的话,在main.js里面
import eventBus from './util/eventBus'
Vue.prototype.$bus = eventBus
局部调用的话,直接在调用的组件内引入这个文件
import bus from './../../util/eventBus.js'
使用方法为,传递处
this.$bus.$emit('mapId', this.mapId)
这里向全局传递了一个名为mapId的数据,他的内容是this.mapId
在使用处接收即可,target就是传递而来的this.mapId的内容
this.$bus.$on('mapId', target=>{
console.log(target)
})