vue中总线机制(EventBus) EventBus作为所有组件共享的事件中心

一、EventBus的简介
EventBus 又称时间总线 ,理解上来讲 EventBus 机制是通知的概念,EventBus作为所有组件共享的事件中心,既可以发送事件也可以接受事件,所有组件都可以平行的接到到相对应的数据。

新建一个js文件

// EventBus.js
import Vue from 'vue'
export defalut new Vue()

在点击页面的点击事件里面写:前面是事件,后面是值
页面需要引入EventBus文件
使用 EventBus.$emit(‘事件名称’,数据)进行发送数据

  import { EventBus  } from "@/utils/event-bus";
  	components: {
	  EventBus,
	},
EventBus.$emit('exportTaskInfo',asyncExcelAStatus);

在需要事件调用的页面:前面是事件,后面是值
页面需要引入EventBus文件

在组件中引入总线文件 ,使用 EventBus.$on(‘emit事件名’,callback(payload1...))进行接受事件
在一个组件中某事件如果只监听一次的话,可以使用 EventBus.$once('事件名称',callBack(payload1...));
EventBus.$off('XXXXX', {}) // 移除指定事件
EventBus.$off('XXXXX') // 移除应用内所有对此事件的监听
EventBus.$off() // 移除应用内所有事件的监听
	mounted() {
		EventBus.$on('exportTaskInfo',this.exportTaskInfo);
	},
	beforeDestroy() {
		// 组件销毁前移除事件监听器
		EventBus.$off('exportTaskInfo', this.exportTaskInfo);
	},

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mfbz.cn/a/771179.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

高校搭建AIGC新媒体实验室,创新新闻教育教学模式

高校作为人才培养的重要阵地,必须紧跟时代步伐,不断创新教育教学模式,提升跨界融合育人水平,通过AIGC新媒体实验室探索创新人才培养模式。AIGC新媒体实验室不仅能够高效赋能高校宣传媒体矩阵,也可以助力教学实践与AIGC…

KUKA机器人中断编程3—暂停功能的编程

在KUKA机器人的使用过程中,对于调试一个项目,当遇到特殊情况时需要暂停机器人,等异常情况处理完成后再继续机器人的程序运行。wait for指令是等待一个输入信号指令,没有输入信号,机器人一直等待。在一定程度上程序也不…

vue3中使用Antv G6渲染树形结构并支持节点增删改

写在前面 在一些管理系统中,会对组织架构、级联数据等做一些管理,你会怎么实现呢?在经过调研很多插件之后决定使用 Antv G6 实现,文档也比较清晰,看看怎么实现吧,先来看看效果图。点击在线体验 实现的功能…

仓颉——申请内测、环境搭建、编译测试

2024年6月21日,华为仓颉正式公开发布。 不少同学看过仓颉白皮书后,都在找SDK从哪下载,HelloWorld怎么跑。仓颉公众号也及时发布了内测的方式,我也亲自走了一遍整个流程, 一,申请内测 关注“仓颉编程语言…

香橙派AIpro做目标检测

使用香橙派AIpro做目标检测 文章目录 使用香橙派AIpro做目标检测香橙派AIpro开发板介绍香橙派AIpro应用体验YOLOV5s目标检测使用场景描述图像目标检测视频目标检测摄像头目标检测YOLOv5s 目标检测的运行结果分析香橙派 AIpro 在运行过程中的表现 香橙派AIpro AI应用场景总结 香…

leetCode-hot100-动态规划专题

动态规划 动态规划定义动态规划的核心思想动态规划的基本特征动态规划的基本思路例题322.零钱兑换53.最大子数组和72.编辑距离139.单词拆分62.不同路径63.不同路径Ⅱ64.最小路径和70.爬楼梯121.买卖股票的最佳时机152.乘积最大子数组 动态规划定义 动态规划(Dynami…

Python 项目依赖离线管理 pip + requirements.txt

背景 项目研发环境不支持联网,无法通过常规 pip install 来安装依赖,此时需要在联网设备下载依赖,然后拷贝到离线设备进行本地安装。 两台设备的操作系统、Python 版本尽可能一致。 离线安装依赖 # 在联网设备上安装项目所需的依赖 # -d …

香港即将“放松”加密货币监管!加密牌照制度备受批评!全球主力军无法进入香港市场?动摇了香港Web3的信心!

2024年7月3日,香港金融服务及库务局局长许正宇在立法会会议上表示,香港金融管理局(HKMA)和证券及期货事务监察委员会(SFC)将根据市场发展情况,适时检讨虚拟资产相关活动的监管要求。 这一表态引发了人们对香港加密货币监管框架可能进行调整的…

AI智能音箱用2×15W立体声功放芯片NTP8918

智能音箱是近年来非常受欢迎的智能家居产品之一,它集成了人工智能技术和音频技术,能够为用户提供语音助手、音乐播放、智能家居控制等多种功能。其中,音频输出是智能音箱的核心功能之一,而功放芯片则是实现音频放大的关键组成部分…

尽量不写一行if...elseif...写出高质量可持续迭代的项目代码

背景 无论是前端代码还是后端代码,都存在着定位困难,不好抽离,改造困难的问题,造成代码开发越来越慢,此外因为代码耦合较高,总是出现改了一处地方,然后影响其他地方,要么就是要修改…

Liunx网络配置

文章目录 一、查看网络配置永久修改网卡临时修改网卡 二、查看主机名称 hostname三、查看路由表条目 route四、查看网络连接情况netstat五、获取socket统计信息ss六、查看当前系统中打开的文件和进程的工具lsof七、测试网络连通性ping八、跟踪数据包 traceroute九、域名解析 ns…

适合金融行业的国产传输软件应该是怎样的?

对于金融行业来说,正常业务开展离不开文件传输场景,一般来说,金融行业常用的文件传输工具有IM通讯、邮件、自建文件传输系统、FTP应用、U盘等,这些传输工具可以基础实现金融机构的文件传输需求,但也存在如下问题&#…

ONNXRuntime与CUDA所对应的版本

官方链接: NVIDIA - CUDA | onnxruntime

软信天成:您的数据仓库真的“达标”了吗?

在复杂多变的数据环境中,您的数据仓库是否真的“达标”了?本文将深入探讨数据仓库的定义、合格标准及其与数据库的区别,帮助您全面审视并优化您的数据仓库。 一、什么是数据仓库? 数据仓库是一个面向主题的、集成的、相对稳定的、…

Django任意URL跳转漏洞(CVE-2018-14574)

目录 Django介绍 URL跳转漏洞介绍 Django任意URL跳转漏洞介绍 环境搭建 防御方法 前段时间在面试时,问到了URL跳转漏洞,我没有回答好,下午把URL跳转漏洞学习了,发现也不难,看来还需要学习的东西很多呀&#xff0c…

AI 芯片之战:开启智能新时代的关键角逐

在科技发展的浪潮中,一场围绕 AI 芯片的激烈竞争正在全球范围内如火如荼地展开。多家巨头纷纷投身其中,使得这场混战已然进入白热化阶段。 AI 芯片,作为推动人工智能发展的核心硬件,其作用举足轻重。它能够高效地处理海量的数据&a…

# Kafka_深入探秘者(9):kafka 集群管理

Kafka_深入探秘者(9):kafka 集群管理 一、kafka 集群概述 1、kafka 集群概述: 集群是一种计算机系统,它通过一组松散集成的计算机软件和/或硬件连接起来高度紧密地协作完成计算工作。在某种意义上,他们可…

Webpack: 并行构建

概述 受限于 Node.js 的单线程架构,原生 Webpack 对所有资源文件做的所有解析、转译、合并操作本质上都是在同一个线程内串行执行,CPU 利用率极低,因此,理所当然地,社区出现了一些以多进程方式运行 Webpack&#xff0…

SQL Server详细使用教程(包含启动SQL server服务、建立数据库、建表的详细操作) 非常适合初学者

文章目录 目录 前言 一、启动SQL server服务的三种方法 1.不启动SQL server服务的影响 2.方法一:利用cmd启动SQL server服务 3.方法二:利用SQL Server配置管理器启动SQL server服务 4.方法三:在服务管理器中启动SQL server服务 二、建立数据库…

数据结构 —— 图的遍历

数据结构 —— 图的遍历 BFS(广度遍历)一道美团题DFS(深度遍历) 我们今天来看图的遍历,其实都是之前在二叉树中提过的方法,深度和广度遍历。 在这之前,我们先用一个邻接矩阵来表示一个图&#…