Vue父子组件通信(项目实用)【聪明人都知道的】

创建一个事件集中器，统一收集事件，（中央事件总线）
1.创建一个js文件eventBus.js

import Vue from 'vue';
export default new Vue();

问题 是需要使用的时候 需要import 导入一下eventBus.js
1.pro 在mian.js

var eventBus = {
 install(Vue,options) {
  Vue.prototype.$bus = vue
 }
};
Vue.use(eventBus);

使用 $emit发消息, $on接收消息, $off清除事件监听

发送数据的组件

methods: {
	testFunc() {
		this.$bus.$emit('schoolList',this.schoolList)
	}
}

接收（监听）数据组件

created() {
 	this.$bus.$on('schoolList', (params) => { //获取传递的参数并进行操作
 	 // 业务
 	})
},
// 最好在组件销毁前
// 清除事件监听
beforeDestroy () {
 this.$bus.$off('schoolList');
},

希望本文的内容对大家的学习或者工作能带来一定的帮助，
如果有疑问大家可以留言交流

原文链接：https://juejin.im/post/5a4353766fb9a044fb080927