vue中央事件总线eventBus的简单理解和使用
公共事件总线eventBus的实质就是创建一个vue实例,通过一个空的vue实例作为桥梁实现vue组件间的通信。它是实现非父子组件通信的一种解决方案。
用法如下:
第一步:项目中创建一个js文件(我通常给它取个名字为bus.js),引入vue,创建一个vue实例,导出这个实例,代码如下(一共就两行):
1 import Vue from 'Vue' 2 export default new Vue
1 Bus.$on('click',target => { 2 console.log(target) // 注意:发送和监听的事件名称必须一致,target就是获取的数据,可以不写target。只要你喜欢叫什么都可以(当然了,这一定要符合形参变量的命名规范) 3 })
1 beforeDestroy(){ 2 bus.$off('click') 3 }
总结一下,这里只是介绍如何使用eventBus来解决非父子组件通信,但是当项目较大较复杂时,并不适合。到那时,vuex才是vue给我们提供的最理想的方式。
注意:以上存粹是个人的理解,有不同观点或者其他建议的欢迎交流学习!
转载于:https://www.cnblogs.com/singerlee-changealive/p/10519822.html
vue中央事件总线eventBus的简单理解和使用相关推荐
- 2021-12-14 vue移动端卖座电影项目(十二) 使用mapState控制封装选项卡tabbar的显隐,以及回顾使用中央事件总线eventbus和vuex的state控制tabbar显隐的异同
文章目录 0.实现场景:进入详情页时,底部选项卡隐藏 1.使用中央事件总线控制tabbar的v-show的值 2.使用vuex的state控制tabbar的v-show的值 3.使用vuex的muta ...
- python 全栈开发,Day91(Vue实例的生命周期,组件间通信之中央事件总线bus,Vue Router,vue-cli 工具)...
昨日内容回顾 0. 组件注意事项!!!data属性必须是一个函数!1. 注册全局组件Vue.component('组件名',{template: ``})var app = new Vue({el: ...
- vue 事件总线EventBus的概念、使用以及注意点
vue组件中的数据传递最最常见的就是父子组件之间的传递.父传子通过props向下传递数据给子组件:子传父通过$emit发送事件,并携带数据给父组件.而有时两个组件之间毫无关系,或者他们之间的结构复杂, ...
- Google guava 事件总线 EventBus 进程内消息队列
Google guava 事件总线 EventBus 创建事件总线流程 码代码 引入依赖 一个简单的事件处理 监听者 创建事件生产者总线.注册事件监听者.发送事件 运行结果 扩展 多个事件监听者加De ...
- 安卓Android事件总线EventBus简单使用
EventBus是的主要功能是替代Intent,Handler,BroadCast在Fragment,Activity,Service,线程之间传递消息,优点是开销小,代码更优雅.以及将发送者和接收者 ...
- 自己动手写事件总线(EventBus)
2019独角兽企业重金招聘Python工程师标准>>> 本文由云+社区发表 事件总线核心逻辑的实现. <!--more--> EventBus的作用 Android中存在 ...
- Android之事件总线EventBus详解
顾名思义,AndroidEventBus是一个Android平台的事件总线框架,它简化了Activity.Fragment.Service等组件之间的交互,很大程度上降低了它们之间的耦合,使我们的代码 ...
- 200代码写一套属于自己的事件总线(EventBus)库
理论千万篇,不如实战来一篇. 源码 https://github.com/harvie1208/EventBus 关键词:观察者模式.反射.自定义注解.线程调度 手写200行代码,一步一步实现Even ...
- Android 事件总线 EventBus入门及使用
何为事件总线? 是对发布-订阅模式的一种实现. 它是一种集中式事件处理机制,允许不同的组件之间进行彼此通信而又不需要相互依赖,达到一种解耦的目的.学习它之前最好先了解下观察者模式 说白了就是不同组件间 ...
最新文章
- 一级域名和二级域名的区别是什么?作用怎样?
- Linux学习笔记(知识点总结)
- 中国大学MOOC 计算机组成原理第4章 测试(中)
- Java lambda expression
- 【Elasticsearch】搜索引擎从0到1 有赞 视频笔记
- ipad如何与计算机连接网络连接不上,平板电脑网络连接不上怎么办
- Matploblib work5
- 用python画糖葫芦_python学习记录六
- jQuery Mobile主题使用与定制
- AWD竞赛脚本大全——从攻击到防御
- html图片在桌面的路径,桌面路径无法恢复以前的路径
- 【FICO】标准成本、计划成本、实际成本、目标成本
- Openlayers记录(七)利用ol3进行缓冲区的空间相交分析
- 数据分析师,年终述职报告可以这么写(实操版)
- 网页上能否加一个旺旺的连接? 就和qq那样的。
- Opencv配置常见问题:
- Google 开源项目风格指南--C++ 风格指南
- mac 打字卡顿的解决方法
- 在Windows(VMware)环境中安装Linux虚拟机(CentOS)
- 唐宇迪学习笔记10:项目实战-交易数据异常检测
热门文章
- 工作中的git实际使用
- 查询中国城市公交线路
- Java 开发人员必知必会的 20 种常用类库和 API
- OpenStack、Docker、KVM被评为最火的云开源项目
- Online ML那点事-!
- 计算机专业 操作系统,计算机操作系统
- jQuery(三) javascript跨域问题(JSONP解决)
- Python运维-获取当前操作系统的各种信息
- 找呀志_ContentResolver操作ContentProvider数据
- 给定一个用户,获取其密码警告期限;而后判断用户密码使用期限是否已经小于警告期限...