A组件往B组件传递数据data

1.src下创建文件eventBus.js,内容:

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

2.在A,B组件分别引入

import eventBus from'@/eventBus.js'

3.A组件开始传递

eventBus.$emit('datalist',data)

4.B组件接收

created(){
eventBus.$on('datalist',(message)=>{
console.log(message)
})
},

vue使用bus.js在兄弟组件传值的更多相关文章

  1. vue 父子组件传值,兄弟组件传值

    父子组件中的传值 父向子    v-bind props <!-- 组件使用v-bind传值 --> <router :msg="msg"></rou ...

  2. 第七十五篇:Vue兄弟组件传值

    好家伙, 兄弟组件的传值用到Eventbus组件, 1.EventBus的使用步骤 ① 创建 eventBus.js 模块,并向外共享一个Vue的实例对象 ②在数据发送方, 调用bus.$emit(' ...

  3. react 兄弟组件传值(发布订阅,使用于任何组件传值,包括vue)

    react中兄弟组件传值常规操作一般是,A组件传给父组件,父组件再传给B组件 非常规操作 利用  pubsub-js 在Home组件内调用 PubSub.publish("第一个参数是事件名 ...

  4. 创建组件的方法,组件的props属性、state属性的用法和特点,父子组件传值,兄弟组件传值

    1.创建组件的方法   函数组件   class组件 1.1 函数组 无状态函数式组件形式上表现为一个只带有一个 `render()` 方法的组件类,通过函数形式或者 `ES6` 箭头 `functi ...

  5. React创建组件的方法,组件的props属性、state属性的用法和特点,父子组件传值,兄弟组件传值

    创建组件的方法,组件的props属性.state属性的用法和特点,父子组件传值,兄弟组件传值 1.react组件 1.1.创建组件的方法 1.1.1.函数组件 定义一个组件最简单的方式是使用JavaS ...

  6. vue3 语法糖setup 兄弟组件传值

    使用 mitt // 全局引入 npm install mitt 或者 cnpm install mitt 在main文件中挂载 import { createApp } from 'vue' imp ...

  7. React中兄弟组件传值

    兄弟组件传值 实际上是间接的通过第三方来实现传值,举例,第一个儿子把值传给父亲,父亲在把这个值传给第二个儿子,这样就实现了兄弟组件传值 来看代码: 父组件代码 import React from 'r ...

  8. vue 2 使用Bus.js进行兄弟(非父子)组件通信 简单案例

    vue2中废弃了$dispatch和$broadcast广播和分发事件的方法.父子组件中可以用props和$emit().如何实现非父子组件间的通信,可以通过实例一个vue实例Bus作为媒介,要相互通 ...

  9. vue.js 兄弟组件传值

    另:  在vue里,组件之间的作用域是独立的,父组件跟子组件之间的通讯可以通过prop属性来传参,但是在兄弟组件之间通讯就比较麻烦了,虽然可以使用事件监听的方式,但还是不如vuex专业.比如A组件要告 ...

  10. 使用Bus.js进行兄弟(非父子)组件通信

    首先需要在任意地方添加一个bus.js: 在bus.js里面 写入下面信息 import Vue from 'vue' export default new Vue; 在需要通信的组件都引入Bus.j ...

随机推荐

  1. C++ Concurrency in Action 读书笔记一:thread的管理

    为避免混淆,用thread表示std::thread及其对象实例,用线程表示操作系统概念下的线程 Chapter 2 thread的管理 2.1 thread的创建(构造函数) a. 默认构造函数 d ...

  2. 《Go程序设计语言》学习笔记之函数变量和匿名函数

    <Go程序设计语言>学习笔记之函数变量和匿名函数 一. 环境 Centos8.5, go1.17.5 linux/amd64 二. 函数变量 1. 概念 像其它的值一样,函数变量也有类型, ...

  3. KingbaseES V8R6 中syssql_tmp目录说明

    前言 不久前有前端人员咨询过一个问题,为什么syssql_tmp目录下会产生如此多的大文件. 针对这个目录的解释是:临时文件(用于排序超出内存容量的数据等操作)是在$KINGBASE_DATA/bas ...

  4. KingbaseES错误unsupported for database link处理

    KingbaseES使用dblink查询报错:unsupported for database link 适用于: KingbaseES所有版本. 问题现象: KingbaseES创建kingbase ...

  5. KingbaseES Create Index Concurrently 过程探究

    前言: 我们知道Oracle 可以通过create index online 在线创建索引,而不影响其他会话修改数据,但Oracle 实际在online 创建索引的最后一步,实际还是需要进行锁升级,申 ...

  6. 基于IDEA javaweb项目目录结构

    https://www.pianshen.com/article/62631355687/

  7. 从0开始学杂项 第四期:隐写分析(3) GIF 图片隐写

    Misc 学习(四) - 隐写分析:GIF 图片隐写 在上一期,我主要讲了讲自己对于隐写分析中的 PNG 图片隐写的一些浅薄理解,这一期我们继续对隐写分析的学习,学习的是图片隐写中的 GIF 图片隐写 ...

  8. OpenHarmony 3.2 Release新特性解读之驱动HCS

      OpenAtom OpenHarmony(以下简称"OpenHarmony")开源社区,在今年4月正式发布了OpenHarmony 3.2 Release版本,标准系统能力进一 ...

  9. Demo Day直播 | 成长计划解决方案学生挑战赛一等奖即将揭晓!

      OpenAtom OpenHarmony开源开发者成长计划 解决方案学生挑战赛 Demo Day来袭! 每一支队伍 心怀梦想,攻坚克难 迸发出照亮世界的火花 用技术推动世界进步 与你一起,共创未来 ...

  10. MOGDB/openGauss索引推荐及虚拟索引

    MOGDB/openGauss 索引推荐及虚拟索引 索引推荐 在 ORACLE 的优化中,可能大家有接触过 SQL Tuning Advisor(SQL 调优顾问,STA),类似的 MOGDB/ope ...