有时候两个组件也需要通信(非父子关系)。当然Vue2.0提供了Vuex,但在简单的场景下,可以使用一个空的Vue实例作为中央事件总线。

eventBus.js放在assets

import Vue from 'Vue'

export default new Vue;

哪个组件中使用引入进去

import bus from '../../assets/eventBus';
//触发这个方法即可userDefinedEvent这个函数
sendMsg:function(){ bus.$emit('userDefinedEvent','this message is from person_info'); },

需要同步做出改变的组件,可以监听到userDefinedEvent这个事件

bus.$on('userDefinedEvent', function(mes) {
//console.log(mes);
})

bus总线的更多相关文章

  1. vue组件中—bus总线事件回调函数多次执行的问题

    在利用vue组件进行事件监听时发现,如果对N个vue组件实例的bus总线绑定同一事件的回调函数,触发任意组件的对应事件,回调函数至少会被执行N次,这是为什么呢? 为此,调研了普通对象的事件绑定和触发实 ...

  2. vue Bus总线

    有时候两个组件也需要通信(非父子关系).当然Vue2.0提供了Vuex,但在简单的场景下,可以使用一个空的Vue实例作为中央事件总线. 参考:http://blog.csdn.net/u0130340 ...

  3. Vue中兄弟组件间传值-(Bus/总线/发布订阅模式/观察者)

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  4. vue 非父子组件之间的传值(Bus/总线/发布订阅模式/观察者模式)

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  5. vue总线bus传值的一些问题

    动态组件中用总线Bus的坑 在我们的项目总难免会遇到用动态组件,这里就拿vue官方的例子为例,我们欲在组件中添加总线bus(其实官方推荐的vuex更好用,但是有时候我们只需要传一个小状态,不需要用vu ...

  6. SpringCloud之Config配置中心+BUS消息总线原理及其配置

    一.配置中心作用 在常规的开发中,每个微服务都包含代码和配置.其配置包含服务配置.各类开关和业务配置.如果系统结构中的微服务节点较少,那么常规的代码+配置的开发方式足以解决问题.当系统逐步迭代,其微服 ...

  7. SpringCloud全家桶学习之消息总线---SpringCloud Bus

    一.概述 ConfigClient(微服务)从ConfigServer端获取自己对应的配置文件,但是目前的问题是:当远程git仓库配置文件发生改变时,每次都是需要重启ConfigCient(微服务), ...

  8. linux设备驱动归纳总结(八):1.总线、设备和驱动【转】

    本文转载自:http://blog.chinaunix.net/uid-25014876-id-109733.html linux设备驱动归纳总结(八):1.总线.设备和驱动 xxxxxxxxxxxx ...

  9. Linux设备模型(总线、设备、驱动程序和类)

    Linux设备驱动程序学习(13) -Linux设备模型(总线.设备.驱动程序和类)[转] 文章的例子和实验使用<LDD3>所配的lddbus模块(稍作修改). 提示:在学习这部分内容是一 ...

随机推荐

  1. UI 设计的整个工作流程是怎样的?

    作为一个专业UI设计师,不仅仅要了解整个产品在UI界面设计,交互设计中的工作流程,更需要了解整个产品从需求提出到产品上线的整个工作流程. 以下是互联网产品个部门的工作分配及流程: 从图中可以看到,一个 ...

  2. zeromq学习记录(四)使用ZMQ_ROUTER ZMQ_DEALER

    /************************************************************** 技术博客 http://www.cnblogs.com/itdef/   ...

  3. java多线程系列11 juc包下的队列

    队列分为两类  阻塞队列 BlockingQueue提供如下两个支持阻塞的方法:   (1)put(E e): 尝试把e元素放如BlockingQueue中,如果该队列的元素已满,则阻塞该线程.   ...

  4. STL基础4:deque

    #include <iostream> #include <queue> #include <string> using namespace std; #defin ...

  5. nginx图解

    1.Http代理,反向代理:作为web服务器最常用的功能之一,尤其是反向代理. 这里我给来2张图,对正向代理与反响代理做个诠释,具体细节,大家可以翻阅下资料. Nginx在做反向代理时,提供性能稳定, ...

  6. Android studio 中的TabWidget

    1.TabWidget 的 layout文件 <?xml version="1.0" encoding="utf-8"?> <TabHost ...

  7. CentOS配置多公网

      最终目标是同一台服务器可以多个IP地址共同访问,在这个前提下又有如下两种方式: 多个公网IP使用同一个网关 多个公网IP使用不同网关   这两种方式区别所在:1.多个公网IP使用同一个网关,我们只 ...

  8. ReactNative学习笔记(五)踩坑总结

    已经发现的bug或者问题 Android不支持shadow属性: Animated.Image的borderRadius不生效: setNativeProps无法修改图片的source: 没有直接设置 ...

  9. Spring AOP术语:连接点和切点的区别。

    定义: 1.连接点(Join point):连接点是在应用执行过程中能够插入切面(Aspect)的一个点.这些点可以是调用方法时.甚至修改一个字段时. 2.切点(Pointcut):切点是指通知(Ad ...

  10. CURL超时时间设置

    一次完整的http请求,一般包含三个步骤: 通过DNS把域名解析成IP 通过IP地址连接到目标主机 获取目标主机数据(1.给目标主机输出http请求头,以\r\n\r\n结尾:2.获取目标主机传过来的 ...