兄弟组件通讯

eventBus

定义eventBus

eventBus的原理是引入一个新的vue对象,分别调用这个对象的事件发布和监听来实现通信和参数传递。
eventBus 一般会直接用公共一个文件来存放这个vue实例

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

组件A

import eventBus from 'eventBus.js'; 
...
create() {
    eventBus.$on("cmd":todoaction) //监听cmd事件
}

methods:{
    todoaction(data){
    
    }
}

组件B

import eventBus from 'eventBus.js'; 
...
methods: {
    doSomething() {
        eventBus.$emit("cmd", 22);//发送事件cmd
    }
}
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 一、为什么要使用vue-bus? 学习vue的开发者都知道,父子组件的直接的通讯直接使用vue提供的props属性...
    小伙子太认真阅读 3,108评论 1 8
  • 瞎扯 昨天群里聊天,聊到个面试题.兄弟组件通信的方法有哪些听起来好像很难似的.实际上呢.我就拿android中学到...
    Jlanglang阅读 759评论 0 0
  • vue概述 在官方文档中,有一句话对Vue的定位说的很明确:Vue.js 的核心是一个允许采用简洁的模板语法来声明...
    li4065阅读 7,270评论 0 25
  • 第一章 Vue概述 what? Vue是实现UI层的渐进式js框架,核心库关注视图层,简单的ui构建,复杂的路由控...
    fastwe阅读 742评论 0 0
  • 我相信每个人的童年都有一个梦,这个梦肯定是色彩斑斓,却又独一无二的!我的梦是长大以后盖个大房子,里面住着我喜欢的小...
    傲娇的张家大小姐阅读 174评论 0 1