首先在main.js中

Vue.prototype.$eventBus = new Vue()

A组件中通过触发事件或者其他什么,然后发射数据

this.$eventBus.$emit('key','data-1232131232132131232');

B组件中接收A组件的数据

this.$eventBus.$on('key',function(params){ console.log(params); // data-1232131232132131232 });

vue的eventBus的更多相关文章

  1. vue中eventbus的使用

    eventbus的方法很是简单,我们需要做三步事情: 第一步,我们需要创造一个容器去充当我们的eventbus 第二步,我们需要去抛出,或者说提交我们的事件 第三步,我们去监听我们的那个事件(也许这才 ...

  2. vue中eventbus 多次触发的问题

    相比于react,vue是一个更上手很快的框架.所说简单易用,但在做Vue项目的过程中,就会发现,坑还是有的.组件之间传递数据是一个常见的需求,父子组件传递数据在官网有介绍,除了父子组件,一般地,任意 ...

  3. Vue 使用eventBus 实现兄弟组件间的通信

    实现方式:  主要是在相互通信的兄弟组件之中,都引入一个新的vue实例,然后通过分别调用这个实例的事件触发事件广播 和监听来实现通信和参数传递. 需求: a页面tree的增删改后,数据还是之前的老数据 ...

  4. vue中eventbus被多次触发(vue中使用eventbus踩过的坑)【bus.$on事件被多次绑定】

    问题描述:只要页面没有强制刷新,存在组件切换,bus.$on方法会被多次绑定,造成事件多次触发   触发bus.$on中绑定的方法.png   bus.$on多次绑定.png 解决办法:在每次调用方法 ...

  5. Vue(小案例_vue+axios仿手机app)_购物车

    一.前言 1.购物车 二.主要内容 1.效果演示如下,当我们选择商品数量改变的时候,也要让购物车里面的数据改变 2.具体实现 (1)小球从上面跳到下面的效果 (2)当点击上面的“加入购物车按钮”让小球 ...

  6. vue Bus总线

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

  7. vue中兄弟组件间通讯

    vue2.0中兄弟组件间的通讯是通过eventBus(事件发布订阅)实现的. eventBus.js import Vue from 'vue' const eventBus = new Vue() ...

  8. Vue开发中的中央事件总线

    在Vue开发中会遇到大量的组件之间共享数据的情形,针对不同的情形,Vue有相对应的解决方案.比如,父组件向子组件传值可以使用props,复杂项目中不同模块之间传值可以使用Vuex.但是,对于一些简单的 ...

  9. vue数据传递的特殊实现技巧

    最近碰到了比较多的关于vue的eventBus的问题,之前定技术选型的时候也被问到了,vuex和eventBus的使用范围.所以简单的写一下.同时有一种特殊的实现方案. 有这么几种数据传递方式,vue ...

随机推荐

  1. Java文件执行顺序总结

    类执行顺序 一个java文件的执行过程: 编译:加载的类,加载的时候对类中的资源进行编译,首先是静态成员变量,静态方法等,如果有相应操作,就会进行相应的操作, 并且这个Static修饰后的静态成员变量 ...

  2. ./run.sh --indir examples/demo/ --outdir examples/results/ --vis

    (AlphaPose20180911) luo@luo-ThinkPad-W540:AlphaPose$ ./run.sh --indir examples/demo/ --outdir exampl ...

  3. mybatis 框架 的应用之二(批量添加、实现分页查询)

    lf-driver=com.mysql.jdbc.Driver lf-url=jdbc:mysql://localhost:3306/test lf-user=LF lf-password=LF &l ...

  4. Python pandas DataFrame操作

    1. 从字典创建Dataframe >>> import pandas as pd >>> dict1 = {'col1':[1,2,5,7],'col2':['a ...

  5. c语言实践 数字特征值

    这题的要求是这样的: 这题我没做出来,我大概思路是这样的,根据输入的数字,把这个数字的每一位都分离出来,然后判断奇数还是偶数,再判断序是奇数还是偶数,最后两个奇偶性比较,输出1还是0,这个输出的1和0 ...

  6. C# Code 非常好的学习博客

    https://ardalis.com/how-to-become-master-writing-c-code

  7. (转)Asp.Net生命周期系列一

    原文地址:http://www.cnblogs.com/skm-blog/archive/2013/07/07/3176713.html Asp.Net生命周期对于初级甚至中级程序员来说,一直都是一个 ...

  8. 编写高质量代码改善C#程序的157个建议——建议15: 使用dynamic来简化反射实现

    建议15: 使用dynamic来简化反射实现 dynamic是Framework 4.0的新特性.dynamic的出现让C#具有了弱语言类型的特性.编译器在编译的时候不再对类型进行检查,编译器默认dy ...

  9. 【转】Android android listview的HeadView左右切换图片(仿新浪,网易,百度等切换图片)

    首先我们还是看一些示例:(网易,新浪,百度)      下面我简单的介绍下实现方法:其实就是listview addHeaderView.只不过这个view是一个可以切换图片的view,至于这个vie ...

  10. Java Serializable(序列化)的理解和总结

    1.序列化是干什么的?       简单说就是为了保存在内存中的各种对象的状态(也就是实例变量,不是方法),并且可以把保存的对象状态再读出来.虽然你可以用你自己的各种各样的方法来保存object st ...