vue 组件之间的自定义方法互相调用
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 组件之间的自定义方法互相调用的更多相关文章
- vue组件之间的传值——中央事件总线与跨组件之间的通信($attrs、$listeners)
vue组件之间的通信有很多种方式,最常用到的就是父子组件之间的传值,但是当项目工程比较大的时候,就会出现兄弟组件之间的传值,跨级组件之间的传值.不可否认,这些都可以类似父子组件一级一级的转换传递,但是 ...
- 前端面试 vue 部分 (5)——VUE组件之间通信的方式有哪些
VUE组件之间通信的方式有哪些(SSS) 常见使用场景可以分为三类: 父子通信: null 父向子传递数据是通过 props ,子向父是通过 $emit / $on $emit / $bus Vuex ...
- vue组件之间的传参
vue组件之间传参有三种传参方式'父传子','子传父','非父子组件之间传值' 父传子 父组件 <template> <CounterCom :num="5"&g ...
- vue组件之间传值方式解析
vue组件之间传值方式解析一.父组件传到子组件 1.父组件parent代码如下: <template> <div class="parent"> <h ...
- vuex-- Vue.的中心化状态管理方案(vue 组件之间的通信简化机制)
vuex-- Vue.的中心化状态管理方案(vue 组件之间的通信简化机制) 如果你在使用 vue.js , 那么我想你可能会对 vue 组件之间的通信感到崩溃 .vuex就是为了解决组件通信问题的. ...
- 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 ...
- vue 组件之间互相传值:兄弟组件通信
vue 组件之间互相传值:兄弟组件通信我们在项目中经常会遇到兄弟组件通信的情况.在大型项目中我们可以通过引入 vuex 轻松管理各组件之间通信问题,但在一些小型的项目中,我们就没有必要去引入 vuex ...
- Vue 组件之间通信 All in One
Vue 组件之间通信 All in One 组件间通信 1. 父子组件之间通信 https://stackblitz.com/edit/vue-parent-child-commutation?fil ...
- vue 父子组件传值以及方法调用,平行组件之间传值以及方法调用大全
vue项目经常需要组件间的传值以及方法调用,具体场景就不说了,都知道.基本上所有的传值都可以用vuex状态管理来实现,只要在组件内监听vuex就好. vue常用的传值方式以及方法有: 1. 父值传子( ...
- Vue 组件之间传值
一.父组件向子组件传递数据 在 Vue 中,可以使用 props 向子组件传递数据. 子组件部分: 这是 header.vue 的 HTML 部分,logo 是在 data 中定义的变量. 如果需要从 ...
随机推荐
- 安装 配置 正向 解析 DNS方法
安装 配置 正向 解析 DNS方法 1,安装dhcp [root@localhost ~]#yum install bind* -y 2,关闭防火墙和selinux [root@localhost ~ ...
- FreeSWITCH添加自定义endpoint之媒体交互
操作系统 :CentOS 7.6_x64 FreeSWITCH版本 :1.10.9 之前写过FreeSWITCH添加自定义endpoint的文章: https://www.cnblogs.com/ ...
- Ehcache的Maven依赖及其配置文件
Ehcache的Maven依赖 <!-- https://mvnrepository.com/artifact/org.mybatis.caches/mybatis-ehcache --> ...
- 如何用IoT边缘连接器实现云端应用控制PLC?
本文分享自华为云社区<数字工厂深入浅出系列(十):IoT边缘连接器实现云端应用控制PLC>,作者: 云起MAE. 通过IoT云平台和边缘计算的技术设施,工厂可以将PLC等OT过程制造控制器 ...
- k8s实战案例之运行WordPress
1.WordPress架构 LNMP案例之基于Nginx+PHP实现WordPress博客站点,要求Nginx+PHP运⾏在同⼀个Pod的不同容器;nginx主要作用是接入站点请求,如果请求静态资源n ...
- python 获取本周 ,上周,本月,上月,本季,上季,今年, 去年的第一天和最后一天
import datetime from datetime import timedelta now = datetime.datetime.now()# 获取当前月的天数 month = 2days ...
- Go学习笔记1
学习路线 2023-Go全链路工程师课纲 https://www.processon.com/view/link/63594cd97d9c0854f9ac855e 一.搭建环境 https://stu ...
- pandas常用的数据类型,(serises和dataform)
- 【解惑】孜孜不倦,用足球赛程详解c#中的yield return用法
在一个知名企业赞助的足球联赛中,有256支球队参赛.为了确保比赛的顺利进行,企业指派了小悦负责熬夜加班制定每一个球队的赛程.尽管她对足球的了解并不多,但是她对待工作的认真态度却让人钦佩. 在小悦的努力 ...
- 一文浅谈Mockito使用
一.前期准备- 1.准备工作 <!--mockito依赖-->a <dependency> <groupId>org.mockito</groupId> ...