全局事件总线

全局事件总线作用就是实现组件间通信,就像对讲机一样

首先:我们如何让所有的组件都能访问到x,我们可以使用window绑定,但是发现以后我们都要依赖于window这个对象;还有种方式就是在vc它的源码上即,prototype上绑定;但这俩种方法都太麻烦了,因此我们可以在Vue.prototype绑定x,因为原型链的关系所有的vc实例都能访问到vue实例上的属性

 但是它是不具备$on,$off,$emit方法的,因为它只是一个object对象,它没有这个属性就要去找object原型对象中找这个属性,那肯定是没有的,为什么?因为像$on,$off,$emit都是vue这个原型对象上的方法

 

在beforeCreate事件中安装全局事件总线  Vue.prototype.$bus = this即 Vue.prototype.$bus = vm

为什么不写在外面,如果你在外面写的话,会导致组件已经创建好了,你才去绑定,你最终会没有绑定上的

 

用完之后要把这个总线解绑,因为这个总线是一种存在的

不然bus也太累了吧没了的东西还得背着 

总结:

全局事件总线(GlobalEventBus)

* 一种组件间通信的方式,适用于`<span style="color:red">`任意组件间通信。
* 安装全局事件总线:

new Vue({
	......
	beforeCreate() {
		Vue.prototype.$bus = this //安装全局事件总线,$bus就是当前应用的vm
	},
    ......
}) 

使用事件总线:

接收数据:A组件想接收数据,则在A组件中给$bus绑定自定义事件,事件的`<span style="color:red">`回调留在A组件自身。

methods(){
  demo(data){......}
}
......
mounted() {
  this.$bus.$on('xxxx',this.demo)
}

* 提供数据:``this.$bus.$emit('xxxx',数据)``
* 最好在beforeDestroy钩子中,用$off去解绑`<span style="color:red">`当前组件所用到的事件。要不然它身上的东西太多了

TodoList案例--全局事件总线

对App.vue和MyIitem.vue进行事件总线绑定

这俩个逐层传递

main.js里面设置一个全局总线

收数据的人去绑定事件总线上的自定义事件

 当出发了,就把它需要的函数传进去触发 

 触发$emit

最终效果跟之前一致了

 

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

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

相关文章

带你弄明白c++的4种类型转换

目录 C语言中的类型转换 C强制类型转换 static_cast reinterpret_cast const_cast dynamic_cast RTTI 常见面试题 这篇博客主要是帮助大家了解和学会使用C中规定的四种类型转换。首先我们先回顾一下C语言中的类型转换。 C语言中的类型转换 在C语言中&#xff0c;如果赋…

电商一站式管理后台必备工具:电商API接口,网络爬虫、数据抓取、批量处理订单

随着网络的发展&#xff0c;网络购物已经成为人们的日常生活方式之一。电商们也面对日益强烈的竞争压力。很多电商都会使用一站式后台管理软件&#xff0c;来实现多平台操作&#xff0c;为公司日常管理提升效率。如何实现多电商平台的数据交互呢&#xff1f; 这里就需要用到电…

VectorDraw Developer Framework 10.1003.1 Crack

VectorDraw Developer Framework &#xff08;VDF&#xff09; 10.1003.1.0 添加对“vdPolyface”的纹理支持并提高性能。 23月 2023&#xff0c; 16 - 36&#xff1a;<>新版本 特征 发动机 改进了“GeVisibleArea”和“GetModel2dProjection”性能。带有“ClipBound…

海心沙元宇宙音乐会虚拟主持人玩法再升级,虚拟动力技术全程助力

3月22日晚&#xff0c;由中共广州市委宣传部、广州市文化广电旅游局支持&#xff0c;中共广州市天河区委、广州市天河区人民政府指导的首届湾区元宇宙数字艺术节震撼开幕&#xff0c;一场沉浸式“宙响天河——海心沙元宇宙音乐会”震撼上演&#xff01; 音乐会结合了虚拟主持人…

如何使用 Python Pandas 更新行和列

让我们了解如何使用 Python pandas 更新行和列。 在现实世界中&#xff0c;大多数时候我们没有准备好分析数据集。 可能存在许多不一致、无效值、不正确的标签等等。 话虽如此&#xff0c;更新这些值以实现数据的一致性是非常有必要的。 在本篇文章中&#xff0c;我们将重点介绍…

安装Maven、搭建Maven环境、使用Eclipse创建Maven工程

安装Maven apache官网下载需要的版本&#xff0c;然后解压缩 https://maven.apache.org/download.cgi 也可以选择其他版本 搭建Maven环境 点击此电脑—>属性—>高级系统设置—>环境变量—>新建 新建系统变量 变量名&#xff1a;MAVEN_HOME 值&#xff1a…

基于springboot实现农机电招平台【源码+论文】分享

基于springboot实现农机电招平台演示开发语言&#xff1a;Java 框架&#xff1a;springboot JDK版本&#xff1a;JDK1.8 服务器&#xff1a;tomcat7 数据库&#xff1a;mysql 5.7 数据库工具&#xff1a;Navicat11 开发软件&#xff1a;eclipse/myeclipse/idea Maven包&#xf…

使用Vue脚手架(CLI)创建Vue项目并分析项目结构

什么是Vue脚手架&#xff1f; CLI(Command Line Interface)命令行接口工具 vue脚手架是vue官方提供的标准化开发工具&#xff08;开发平台&#xff09;&#xff0c;帮助开发者专门做工程化开发 关于脚手架版本&#xff1a;选择最新的即可&#xff0c;因为最新的可以兼容低版本…

JAVA入门(开发环境和一些概念)

嵌入式为什么学JAVA 为了做安卓开发 JAVA开发环境 建立工程 这里的src是存放JAVA代码的地方&#xff0c;在这里右键&#xff0c;new&#xff0c;class 生成一个Test.java JAVA的第一个helllo world&#xff1a; 运行&#xff1a; 了解下JAVA的周边概念&#xff08;可能被…

华为OD机试题,用 Java 解【自动曝光】问题 | 含解题说明

华为Od必看系列 华为OD机试 全流程解析+经验分享,题型分享,防作弊指南华为od机试,独家整理 已参加机试人员的实战技巧华为od 2023 | 什么是华为od,od 薪资待遇,od机试题清单华为OD机试真题大全,用 Python 解华为机试题 | 机试宝典本篇题目:自动曝光 题目 一个图像有n个像…

【git】将本地项目同步到远程

前提&#xff1a;git已经安装&#xff0c;并与账号完成密钥绑定 在github上创建一个新仓库 在项目文件夹下&#xff0c;右击选择git bash here &#xff0c;打开一个终端对话框 git init (在项目目录下出现隐藏的.git文件夹&#xff0c;目的是把该项目文件夹变成git可管理…

keepalived

一、企业 keepalived 高可用项目实战 1、Keepalived VRRP 介绍 keepalived是什么 keepalived是集群管理中保证集群高可用的一个服务软件&#xff0c;用来防止单节点故障。 keepalived工作原理 keepalived是以VRRP协议为实现基础的&#xff0c;VRRP全称Virtual Router Redu…

基于springboot+vue仓库管理系统(程序+数据库)

大家好✌&#xff01;我是CZ淡陌。一名专注以理论为基础实战为主的技术博主&#xff0c;将再这里为大家分享优质的实战项目&#xff0c;本人在Java毕业设计领域有多年的经验&#xff0c;陆续会更新更多优质的Java实战项目&#xff0c;希望你能有所收获&#xff0c;少走一些弯路…

【机器学习】03-转换器和预估器、K-近邻算法、朴素贝叶斯算法、决策树等算法知识

分类算法 一、sklearn转换器和预估器 1 转换器 - 特征工程的父类 fit_transform()fit() 计算 每一列的平均值、标准差transform() (x - mean) / std进行最终的转换 2 估计器(sklearn机器学习算法的实现) 估计器(estimator)–一类实现算法的API 实例化一个estimatorestimat…

超好用的浏览器兼容性测试工具,赶紧收藏!

在信息爆炸的今天&#xff0c;浏览器是我们上网搜索信息的必备工具&#xff0c;浏览器拥有较好的兼容性可以提升用户体验&#xff0c;浏览器的兼容性测试是测试人员绕不开的话题&#xff0c;属于软件测试必备的流程之一&#xff0c;小编整理了以下几个超好用的浏览器兼容性测试…

JConsole使用教程

JConsole是一个Java虚拟机的监控和管理工具&#xff0c;可以监控Java应用程序的内存使用、线程和类信息等。 以下是JConsole的使用教程&#xff1a; 1.启动JConsole JConsole是一个Java自带的工具&#xff0c;可以在bin目录下找到jconsole.exe文件。双击运行该文件即可启动JC…

全国首个、大势共建 | 实景三维领域部级工程技术创新中心正式挂牌运营

2023年3月22日上午&#xff0c;由武汉大势智慧科技有限公司、武汉市测绘研究院&#xff0c;武汉大学、湖北省地理国情监测中心联合共建的全国首个实景三维领域部级工程技术创新中心&#xff1a;自然资源部实景三维建设与城市精细化治理工程技术创新中心在武汉市测绘研究院正式挂…

Vue+springboot 高校图书馆座位预约选座系统java毕业设计项目推荐

目前现有的图书馆选座管理系统对于用户而言其选座管理流程仍然过于繁琐&#xff0c;对于图书馆选座管理而言其系统安全性并不能保障。同时整套系统所使用的技术相对较为落后&#xff0c;界面不能动态化展示。相比较于其它同类型网站而言不能体现技术先进性。 1.2 项目目标 图书…

阿里云-云存储OSS

1.简述OSS 数据的可靠性较强&#xff1a;三重备份 系统的安全性较强&#xff1a;对称加密&#xff0c;签名权限控制以及防盗链功能&#xff1b; 文件存储的容量无限&#xff1b; 无需人工运维&#xff1b; 部署扩容&#xff1a;无需规则&#xff0c;按需扩容&#xff1b; 提供…

Leetcode.1574 删除最短的子数组使剩余数组有序

题目链接 Leetcode.1574 删除最短的子数组使剩余数组有序 Rating &#xff1a; 1932 题目描述 给你一个整数数组 arr&#xff0c;请你删除一个子数组&#xff08;可以为空&#xff09;&#xff0c;使得 arr中剩下的元素是 非递减 的。 一个子数组指的是原数组中连续的一个子序…
最新文章