vue中事件总线bus的用法
./util/Bus.js
import Bus from 'vue';
let install = function (Vue) {
// 设置eventBus
Vue.prototype.bus = new Bus();
} export default { install };- 安装:
npm install vue-bus 在main.js 中引入vuebus:- 1234
importVue from'vue';importVueBus from'vue-bus';Vue.use(VueBus);在组件中使用
触发事件:
this.$bus.emit("事件名",值)应对事件:mounted:function(){this.$bus.on("事件名",function(值){});},destroyed:function(){this.$bus.off("事件名");}this.$bus.emit ==> 触发this.$bus.on ==> 接収this.$bus.off ==> 清除注意:接收后要清除事件,不然会造成不必要的后果!!!
vue中事件总线bus的用法的更多相关文章
- python 全栈开发,Day91(Vue实例的生命周期,组件间通信之中央事件总线bus,Vue Router,vue-cli 工具)
昨日内容回顾 0. 组件注意事项!!! data属性必须是一个函数! 1. 注册全局组件 Vue.component('组件名',{ template: `` }) var app = new Vue ...
- Vue基础01vue的基本示例,vue的双向数据绑定,vue中常见的几种用法,vue相关常见指令
自学vue框架,每天记录重要的知识点,与大家分享!有不足之处,希望大家指正. 本篇将讲述:vue的基本示例,vue的双向数据绑定,vue中常见的几种用法,vue相关常见指令 前期学习基础,使用vue. ...
- vue笔记 - 组件间通信 之 中央事件总线bus
中央事件总线 - 就是一个名字可以叫做bus的vue空实例,里边没有任何内容: var bus = new Vue(); 人如其名,她就像一个公交车一样,来回输送人,将a站点的A输送到b站点,再将b站 ...
- Vue.js 2.x中事件总线(EvevntBus)及element-ui中全屏loading的使用
事件总线(Event Bus)可以在vue项目的index.js文件中创建,也可以在一个独立的.vue文件中创建.使用时,在各个子组件中引入该组件即可. 项目中的全屏loading较多时,可以在根组件 ...
- vue中央事件总线eventBus的简单理解和使用
公共事件总线eventBus的实质就是创建一个vue实例,通过一个空的vue实例作为桥梁实现vue组件间的通信.它是实现非父子组件通信的一种解决方案. 用法如下: 第一步:项目中创建一个js文件(我通 ...
- 025——VUE中事件的基本使用与VUE中差异
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- vue中mixin的理解与用法
vue中提供了一种混合机制--mixins,用来更高效的实现组件内容的复用.最开始我一度认为这个和组件好像没啥区别..后来发现错了.下面我们来看看mixins和普通情况下引入组件有什么区别? 组件在引 ...
- vue中computed的作用以及用法
在vue中computed是计算属性,主要作用是把数据存储到内存中,减少不必要的请求,还可以利用computed给子组件的data赋值. 参考地址:https://www.jianshu.com/p/ ...
- 026——VUE中事件修饰符之使用$event与$prevent修饰符操作表单
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- vue中is的作用和用法
回顾vue官方文档的过程中发现了is这个特性,虽然以我的写代码风格实在用不上,不过还是记录一下这个知识点 is的作用 <ul> <li></li> <li&g ...
随机推荐
- Java开发环境安装笔记
目录 JDK的版本 Java 8 Java 9 Java 11 (LTS) Java 17 (LTS) Java 21 JDK的环境变量设置 JAVAHOME 和 PATH 环境变量 JAVAPATH ...
- 2024 睿抗机器人开发者大赛CAIP-编程技能赛-本科组(省赛)
2024 睿抗机器人开发者大赛CAIP-编程技能赛-本科组(省赛) RC-u1 热҈热҈热҈ #include<bits/stdc++.h> using namespace std; us ...
- 国内IT行业67家外包公司,有多少程序员在里面待过?
之前写过一篇关于外包公司的文章, <什么是软件外包公司?要不要去外包公司?> 很多粉丝看了后,感觉都在说自己, 存在即合理, 外包大幅度降(可)低(以)了(压)用(榨)人(更)成(多)本( ...
- 十五分钟两百行代码,手写一个vue项目全局通用的弹框
前言: 我们在写vue项目时,弹框是非常常用的组件,并且在同一个项目中,弹框大多类似.所以我们可以抽离封装出一个通用的弹框: 因为vue3可向下兼容,所以作者这边会使用vue2的写法,vue3写法大同 ...
- Go 互斥锁 Mutex 源码分析(二)
原创文章,欢迎转载,转载请注明出处,谢谢. 0. 前言 在 Go 互斥锁 Mutex 源码分析(一) 一文中分析了互斥锁的结构和基本的抢占互斥锁的场景.在学习锁的过程中,看的不少文章是基于锁的状态解释 ...
- 玄机蓝队靶场_应急响应_02:apache日志分析
日志分析这块,感觉都是对grep.awk.sort.wc.uniq,这几个命令的使用. 一:靶场 (1)直接cd到linux日志, cd /var/log 发现apache2目录, cd ./apac ...
- Windows 查看当前登录用户名
使用 PowerShell 输入 whoami,PowerShell 将以 hostname\username 的方式输出主机名和用户名: $ whoami hostname\username 使用 ...
- 关于arcmap使用json文件转要素类
手工编辑了一个json文件,或者在arcgis server下拉取到的json格式文件,通过arcmap进行转换时,出现异常,错误代码001558,此时就是json文件格式不是ansi导致的,用文本编 ...
- 万字长文带你窥探Spring中所有的扩展点
写在前面 Spring的核心思想就是容器,当容器refresh的时候,外部看上去风平浪静,其实内部则是一片惊涛骇浪,汪洋一片.Springboot更是封装了Spring,遵循约定大于配置,加上自动装配 ...
- C#|.net core 基础 - 如何判断连续子序列
前两天同事遇到了一个小需求,想判断一个集合是不是在另一个集合中存在,并且要求顺序一致,然后一起讨论了下应该怎么做,有没有什么比较好的方式?下面分享一下我们想到的方法,如果你也有不同的想法也可以分享给我 ...