兄弟组件之间进行传值(非父子组件);


安装:npm install vue-bus


在main.js中引入vue-bus


import Vue from 'vue';
import VueBus from 'vue-bus'; Vue.use(VueBus);

在组件中使用:


A组件触发事件:

this.$bus.emit("parameterName",params);


B组件接收事件:

this.$bus.on("parameterName",function(value){

  console.log(value)
});
 

组件销毁时解除事件绑定:

destroyed:function(){

  this.$bus.off("parameterName")

}

 
 

vue 里bus的使用的更多相关文章

  1. 了解vue里的Runtime Only和Runtime+Compiler

    转自:了解vue里的Runtime Only和Runtime+Compiler 扩展文章:Vue 2.0如何仅使用Runtime-only Build构建项目? 可以看到有两种版本: Runtime ...

  2. vue里在自定义的组件上定义的事件

    事件分为原生事件和自定义事件. vue里在自定义的组件上定义的事件,都被认为是自定义事件,必须用$emit()来触发. 这也是子组件向父传值的原理. 如果想作为原生事件,需要在原生事件后面加上.nat ...

  3. vue里的渲染以及computed的好处

    如果vue里的某个methods函数执行,导致页面重新渲染,那么所有页面渲染相关的methods函数会重新执行以及时的渲染页面 但是大量函数的重新没有必要的执行会导致性能的下降, 此时如果把没有必要再 ...

  4. vue里的数据

    背景: 一个项目完工在即,鉴于此,前端使用了vue,写下此栏,以供日后翻阅, 会涉及到我所运用到的vue相关知识,需要一定的js基础. 默认vue的single-file-components(单文件 ...

  5. this.$refs.tabs.activeKey ref就是vue里面的id

    this.$refs.tabs.activeKey ref就是vue里面的id

  6. 深入解析Vue里函数的调用顺序介绍

    今天为大家分享一篇对vue里函数的调用顺序介绍,写的十分的全面细致,具有一定的参考价值,对此有需要的朋友可以参考学习下.如有不足之处,欢迎批评指正. method用来定义方法的,比如你@click=& ...

  7. React/Vue里的key到底有什么用?看完这篇你就知道了!(附demo代码)

    网上有很多博客讲到,React.Vue里的key,与 Virtual DOM 及 DOM diff 有关, 可以用来唯一标识DOM节点,提高diff效率,云云. 这大致是对的,但是,大多讲得语焉不详, ...

  8. js里的发布订阅模式及vue里的事件订阅实现

    发布订阅模式(观察者模式) 发布订阅模式的定义:它定义对象间的一种一对多的依赖关系,当一个对象的状态发生改变时,所有依赖于它的对象都将得到通知. 发布订阅模式在JS中最常见的就是DOM的事件绑定与触发 ...

  9. vue里如何灵活的绑定class以及内联style

    在我们平常的前端开发中少不了对DOM的操作,以及样式的动态控制,那我们在使用vue的时候该如何灵活的绑定class呢 1.最简单一个class绑定 v-bind:class设置一个对象,可以动态地切换 ...

随机推荐

  1. Spark中直接操作HDFS

    Spark作为一个基于内存的大数据计算框架,可以和hadoop生态的资源调度器和分布式文件存储系统无缝融合.Spark可以直接操作存储在HDFS上面的数据: 通过Hadoop方式操作已经存在的文件目录 ...

  2. 利用Python操作MySQL数据库

    前言 在工作中,我们需要经常对数据库进行操作,比如 Oracle.MySQL.SQL Sever 等,今天我们就学习如何利用Python来操作 MySQL 数据库. 本人环境:Python 3.7.0 ...

  3. 使用pytorch快速搭建神经网络实现二分类任务(包含示例)

    使用pytorch快速搭建神经网络实现二分类任务(包含示例) Introduce 上一篇学习笔记介绍了不使用pytorch包装好的神经网络框架实现logistic回归模型,并且根据autograd实现 ...

  4. adb如何连接Mac版腾讯手游助手

    Mac版腾讯手游助手,的端口是6555: 所以使用adb connect 127.0.0.1:6555 进行连接

  5. Java实现邮箱验证码

    前言 相比于java实现短信验证码,邮箱验证码就简单了许多,目前只是简单的利用java发送自定义内容至指定邮箱,等过几天再弄短信和邮箱验证码Web版本的.查询网上资料,得知相比于网易邮箱,QQ邮箱是最 ...

  6. 《笨办法学Python 3》python入门书籍推荐|附下载方式

    <笨办法学Python 3>python入门书籍免费下载 内容简介 本书是一本Python入门书,适合对计算机了解不多,没有学过编程,但对编程感兴趣的读者学习使用.这本书以习题的方式引导读 ...

  7. 触发链模式之使用jdk的Observable和Observerver实现触发链模式(附JDK源码)

    首先看看JDK的Observer接口 public interface Observer { void update(Observable o, Object arg); } 也就一个更新的方法,这里 ...

  8. 使用 VMware Workstation Pro让 PC 提供云桌面服务——学习笔记(三)

    目标 当在前面两篇博客后,我们已经创建了一个能当服务器的虚拟机,这时我们需要通过复制虚拟机来让创建更多虚拟机 操作步骤 1.创建克隆 这里主要是VMware软件的操作 虚拟机->管理->克 ...

  9. MongoDB学习2:MongoDB的基本操作

    以下都是基于MongoShell进行操作 1.使用insert进行插入操作  示例: db.<集合>.insertOne(<JSON对象>) db.<集合>.ins ...

  10. CPF 入门教程 - 数据绑定和命令绑定(二)

    CPF netcore跨平台UI框架 系列教程 CPF 入门教程(一) CPF 入门教程 - 数据绑定和命令绑定(二) 数据绑定和Wpf类似,支持双向绑定.数据绑定和命令绑定是UI和业务逻辑分离的基础 ...