博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
vue兄弟组件event-bus通讯
阅读量:7004 次
发布时间:2019-06-27

本文共 519 字,大约阅读时间需要 1 分钟。

1. 思想

  • 使用一个空的 Vue 实例作为事件总线
  • 通过该空Vue实例来监听和触发事件

2.示例代码

以下代码基于vue-cli脚手架搭建

  • 如下代码示例,a和b组件作为兄弟组件在p组件引入
// p.vue
复制代码
  • 在bus.js 中创建一个空的Vue实例
import Vue from 'vue'export default new Vue()复制代码
  • a和b组件想通过bus通讯,则需引入bus.js 。要传递参数的组件,通过$on监听自定义事件;要接受参数的组件,通过$emit 触发自定义事件,并处理传递的参数。
// a.vue
复制代码
// b.vue
复制代码

转载于:https://juejin.im/post/5a0545e16fb9a04514638060

你可能感兴趣的文章