1. 思想
- 使用一个空的 Vue 实例作为事件总线
- 通过该空Vue实例来监听和触发事件
2.示例代码
以下代码基于vue-cli脚手架搭建
- 如下代码示例,a和b组件作为兄弟组件在p组件引入
// p.vue复制代码bus
- 在bus.js 中创建一个空的Vue实例
import Vue from 'vue'export default new Vue()复制代码
- a和b组件想通过bus通讯,则需引入bus.js 。要传递参数的组件,通过$on监听自定义事件;要接受参数的组件,通过$emit 触发自定义事件,并处理传递的参数。
// a.vue组件a复制代码
// b.vue复制代码组件b:{
{ msg }}