1.新建bus.js文件:

import Vue from 'vue'
export default new Vue;

2.在需要通信组件A,B中引入bus:

A组件:

import Bus from "@/assets/bus.js";
methods: {
handleClick: function () {
this.$nextTick(function () { //解决第一次监听不到数据
Bus.$emit('sendData', ‘我是传递的数据’)
})
}
}

B组件:

import Bus from "@/assets/bus.js";
mounted() {
Bus.$on("sendData", val => {
console.log(val)
});
},
 

20、解决Vue使用bus兄弟组件间传值,第一次监听不到数据的更多相关文章

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

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

  2. vue中兄弟组件间通讯

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

  3. Vue2.5开发去哪儿网App 城市列表开发之 兄弟组件间联动及列表性能优化

    一,  兄弟组件间联动 1.  点击城市字母,左侧对应显示 给遍历的 字母 添加一个点击事件: Alphabet.vue @click="handleLetterClick" ha ...

  4. Vue2不使用Vuex如何实现兄弟组件间的通信

    在一些正规的大型项目的企业级开发过程中我们一般会引入Vuex来对Vue所有组件进行状态管理,可以轻松实现各组件间的通信.但是有时候做做自己的小项目,没有必要使用Vuex时,如何简单的实现组件间的通信? ...

  5. Vue中组件间传值常用的几种方式

    版本说明: vue-cli:3.0 一.父子组件间传值 1.props/$emit -父组件==>>子组件: 子组件中通过定义props接收父组件中通过v-bind绑定的数据 父组件代码 ...

  6. Vue-组件传值:子传父和兄弟组件间常见的传值方式

    前言 上篇介绍了我对vue组件化的理解和父组件对子组件传值的方式,这篇介绍下常见的子传父和兄弟组件间的传值方式 目录 子组件向父组件传值 任意组件间的传值方式 正文 子组件向父组件传值 关键知识点:$ ...

  7. Vue学习(二)-Vue中组件间传值常用的几种方式

    版本说明:vue-cli:3.0 主要分为两类: 1.父子组件间的传值 2.非父子组件间的传值 1.父子组件间传值 父组件向子组件传值 第一种方式: props 父组件嵌套的子组件中,使用v-bind ...

  8. 浅谈Vue不同场景下组件间的数据交流

    浅谈Vue不同场景下组件间的数据“交流”   Vue的官方文档可以说是很详细了.在我看来,它和react等其他框架文档一样,讲述的方式的更多的是“方法论”,而不是“场景论”,这也就导致了:我们在阅读完 ...

  9. 【Vue】浅谈Vue不同场景下组件间的数据交流

    浅谈Vue不同场景下组件间的数据“交流”   Vue的官方文档可以说是很详细了.在我看来,它和react等其他框架文档一样,讲述的方式的更多的是“方法论”,而不是“场景论”,这也就导致了:我们在阅读完 ...

随机推荐

  1. centos安装安全狗提示Need system command 'locate' to install safedog for linux的解决方法

    今天为客户的centos服务器安装安全狗时提示Need system command 'locate' to install safedog for linux.Installation aborte ...

  2. 【Linux】查看端口和进程

    netstat -tunlp ps -ef|grep process_name

  3. 第05组 Beta冲刺(1/4)

    第05组 Beta冲刺(1/4) 队名:天码行空 组长博客连接 作业博客连接 团队燃尽图(共享): GitHub当日代码/文档签入记录展示(共享): 组员情况: 组员1:卢欢(组长) 过去两天完成了哪 ...

  4. Ansible常用模块整理

    问答题 请总结今天所学的ansible模块,以及各个模块的作用! ping ping模块用来检查目标主机是否在线 例子:ansible webserver -m ping yum yum模块用来在Ce ...

  5. cc2530的第三次实验,按键中断控制流水灯

    cc2530的第三次实验:按键中断控制流水灯 效果为按一次按键,流水灯亮一次 实验相关电路图: 实验相关寄存器: 初始化函数 //初始化LED灯 //设置P1SEL,通用为0,外设为1 1111110 ...

  6. shell equal

    #!/bin/shzero=0 status=1 let status=0 if [[ $status -eq $zero ]];then echo "bu >= 3.6"e ...

  7. Linux上安装git并在gitlab上建立对应的项目

    1.CentOS上面安装git我所用的CentOS为CentOS6.5,其他版本没有测试. yum install git 安装之后查看git版本信息 git --version 2.配置git信息g ...

  8. 《HeadFirts设计模式》笔记

    定义 在某种情境下,针对某些问题的某种解决方案. 设计模式 1.可拓展性强,方便维护,能够应付变化. 何时使用设计模式 设计之前,还有在重构的时候. OOP 可复用,可扩充,可维护 设计模式原则 1. ...

  9. AKKA Actor创建

    Actor 类定义 Actor 类需要继承AbstractActor类 实现createReceive方法,绑定各类actor收到不同类型消息对应处理不同业务逻辑 默认提供了ReceiveBuilde ...

  10. SQL Server ----- 生成sql 脚本

    通过生成sql 脚本进行数据库转移 选中需要进行转移的数据库 点击生成脚本后出现 进入的是简介界面    直接点击下一步 进入到选择对象界面. 按照步骤进行设置     选择你需要的    架构和数据 ...