1,先定义一个中间通信文件js globalBus.js

import Vue from 'vue';
export const globalBus = new Vue();

2,A.vue组件的方法需要去调用B.vue组件的方法。

首先在b组件去声明方法,,loginTo为方法名 number为接受的参数

import { globalBus } from "../../components/globalBus.js";
mounted() {
globalBus.$on("loginTo", (number) => {
    console.log('调用了这个'+number)
});
},

3,然后再A组件用方法调用 ,loginTo是调用的方法,后面11是传的值

import { globalBus } from "../../components/globalBus.js";
methods: {
gototoUserLogin(){
globalBus.$emit("loginTo",111);
},
}

vue 组件之间的自定义方法互相调用的更多相关文章

  1. vue组件之间的传值——中央事件总线与跨组件之间的通信($attrs、$listeners)

    vue组件之间的通信有很多种方式,最常用到的就是父子组件之间的传值,但是当项目工程比较大的时候,就会出现兄弟组件之间的传值,跨级组件之间的传值.不可否认,这些都可以类似父子组件一级一级的转换传递,但是 ...

  2. 前端面试 vue 部分 (5)——VUE组件之间通信的方式有哪些

    VUE组件之间通信的方式有哪些(SSS) 常见使用场景可以分为三类: 父子通信: null 父向子传递数据是通过 props ,子向父是通过 $emit / $on $emit / $bus Vuex ...

  3. vue组件之间的传参

    vue组件之间传参有三种传参方式'父传子','子传父','非父子组件之间传值' 父传子 父组件 <template> <CounterCom :num="5"&g ...

  4. vue组件之间传值方式解析

    vue组件之间传值方式解析一.父组件传到子组件 1.父组件parent代码如下: <template> <div class="parent"> <h ...

  5. vuex-- Vue.的中心化状态管理方案(vue 组件之间的通信简化机制)

    vuex-- Vue.的中心化状态管理方案(vue 组件之间的通信简化机制) 如果你在使用 vue.js , 那么我想你可能会对 vue 组件之间的通信感到崩溃 .vuex就是为了解决组件通信问题的. ...

  6. vue 组件内 directives指令的调用方式 <base-table v-auto-height:tableHeight="{vm:this, diffHeight:ahTable.diffHeight}"

    vue 组件内 directives指令的调用方式 <base-table v-auto-height:tableHeight="{vm:this, diffHeight:ahTabl ...

  7. vue 组件之间互相传值:兄弟组件通信

    vue 组件之间互相传值:兄弟组件通信我们在项目中经常会遇到兄弟组件通信的情况.在大型项目中我们可以通过引入 vuex 轻松管理各组件之间通信问题,但在一些小型的项目中,我们就没有必要去引入 vuex ...

  8. Vue 组件之间通信 All in One

    Vue 组件之间通信 All in One 组件间通信 1. 父子组件之间通信 https://stackblitz.com/edit/vue-parent-child-commutation?fil ...

  9. vue 父子组件传值以及方法调用,平行组件之间传值以及方法调用大全

    vue项目经常需要组件间的传值以及方法调用,具体场景就不说了,都知道.基本上所有的传值都可以用vuex状态管理来实现,只要在组件内监听vuex就好. vue常用的传值方式以及方法有: 1. 父值传子( ...

  10. Vue 组件之间传值

    一.父组件向子组件传递数据 在 Vue 中,可以使用 props 向子组件传递数据. 子组件部分: 这是 header.vue 的 HTML 部分,logo 是在 data 中定义的变量. 如果需要从 ...

随机推荐

  1. 关于 Task 简单梳理(C#)【并发编程系列】

    〇.前言 Task 是微软在 .Net 4.0 时代推出来的,也是微软极力推荐的一种多线程的处理方式. 在 Task 之前有一个高效多线程操作类 ThreadPool,虽然线程池相对于 Thread, ...

  2. 一篇博客带你上手Git

    概述 安装Git 下载官方网站,下载后安装包样式:双击安装,安装成功后右键文件会有如下选项证明安装成功. 基本配置 设置用户信息,桌面右键,选择Git bash here hecheng@LAPTOP ...

  3. go语言环境要这样搭建才"省钱"

    go语言环境要这样搭建才省钱 目录 go语言环境要这样搭建才省钱 本篇概要 集成开发环境工具(ide) Goland或IntelliJ IDEA Visual Studio Code 其他集成开发环境 ...

  4. 《高级程序员 面试攻略 》rabitmq rcoketmq kafka的区别 和应用场景

    RabbitMQ.RocketMQ 和 Kafka 都是流行的消息中间件系统,用于实现分布式应用程序之间的异步通信.虽然它们都有类似的目标,但在设计和应用场景上存在一些区别. 1. RabbitMQ( ...

  5. 基于 JMeter API 开发性能测试平台

    背景: JMeter 是一个功能强大的性能测试工具,若开发一个性能测试平台,用它作为底层执行引擎在合适不过.如要使用其API,就不得不对JMeter 整个执行流程,常见的类有清楚的了解. 常用的 JM ...

  6. 深入理解Linux内核——内存管理(1)

    提要:本系列文章主要参考MIT 6.828课程以及两本书籍<深入理解Linux内核> <深入Linux内核架构>对Linux内核内容进行总结. 内存管理的实现覆盖了多个领域: ...

  7. 拼多多根据ID取商品详情 API 返回值说明

    ​ item_get-根据ID取商品详情 注册开通 pinduoduo.item_get 公共参数 名称 类型 必须 描述 key String 是 调用key(必须以GET方式拼接在URL中) se ...

  8. 如何做一个api接口?

    程序员是公司里的技术岗位,是产品经理最亲密的伙伴.但是程序员可以理解产品经理的工作,产品经理却不一定理解程序员的工作,所以经常被无良程序员欺骗.从API接口这个维度,分析API的概念以及为什么要了解它 ...

  9. API接口的应用场景

    API数据接口的应用非常广泛,不同的行业和领域都可以使用API数据接口来获取所需的数据,从而实现数据分析.数据挖掘.数据统计等操作.以下是一些常见的API数据接口应用场景: 电商平台:例如淘宝.京东等 ...

  10. ubuntu22.04.3 安装postgresql 16 rc1数据库

    ubuntu22.04.3 安装postgresql 16 rc1数据库 一.直接安装 # Create the file repository configuration: sudo sh -c ' ...