首先,引入"mitt": "^2.1.0",

第二,创建bus.js 文件

第三,使用

需要在需要通信的两个组件里都引用 第二步中的bus

组件1.vue // 触发事件的组件import emitter from '@/utils/bus';自己的方法(){emitter.emit('fRefresh', { rule, isNew });}
组件2.js // 监听事件的组件import emitter from '@/utils/bus';// 在created中监听
created () {emitter.on('fRefresh', data => {// 监听实时数据变化,更新数据响应结果// 业务代码});
}

vue 中 mitt 使用,兄弟组件通信相关推荐

  1. vue2.0s中eventBus实现兄弟组件通信

    在vue1.0中,组件之间的通信主要通过vm.$dispatch沿着父链向上传播和用vm.$broadcast向下广播来实现.然而在vue2.0中,已经废除了这种用法. vuex加入后,对组件之间的通 ...

  2. vue父子组件通信,兄弟组件通信

    目录 一.父子组件通信 1.子组件通过 props 获取父组件变量和父组件调用子组件中的方法(这两个都是父传子的思想) a:子组件通过 props 获取父组件变量 b:父组件调用子组件中的方法 2.父 ...

  3. vue组件间通信之兄弟组件通信(vue3.0$EventBus)

    vue组件间通信之兄弟组件通信(vue3.0$EventBus) vue组件中的数据传递最最常见的就是父子组件之间的传递.父传子通过props向下传递数据给子组件:子传父通过$emit发送事件,并携带 ...

  4. VUE3+TS(父子、兄弟组件通信)

    目录 父传子值.方法(子调用父值.方法) 子传父值(父调用子值) 父读子(子传父)(父调用子值.方法) 兄弟(任意组件)通信 引入Mitt来完成任意组件通信 父传子值.方法(子调用父值.方法) 1.统 ...

  5. [vue] vue中什么是递归组件?举个例子说明下?

    [vue] vue中什么是递归组件?举个例子说明下? 组件自己调用自己,场景有用于生成树形结构菜单 个人简介 我是歌谣,欢迎和大家一起交流前后端知识.放弃很容易, 但坚持一定很酷.欢迎大家一起讨论 主 ...

  6. class根据状态 vue_搞懂并学会运用 Vue 中的无状态组件

    啥是应用程序状态,为什么咱们需要它? 状态管理通常在较小的项目并不需要,但是当涉及到更大的范围时,如企业级的应用大部分需要它了.简单的说,状态是一个包含应用程序使用的最新值的对象.但是,如果咱们从结构 ...

  7. vue中集成的ui组件库_Vue组件可使用Vault Flow通过Braintree集成PayPal付款

    vue中集成的ui组件库 Vue Braintree PayPal按钮 (Vue Braintree PayPal button) Vue component to integrate PayPal ...

  8. 有关QJ_Filecenter在vue中的使用和组件封装

    有关QJ_Filecenter在vue中的使用和组件封装 QJ_FileCenter在vue中的使用和组件封装 安装 第一步:在官网下载QJ_FileCenter安装包 第二部:访问FileCente ...

  9. vue中,右键菜单组件v-contextmenu的使用

    vue中,右键菜单组件v-contextmenu的使用 1.效果 右键菜单之禁用和子菜单 2.流程 第一步:安包 npm install v-contextmenu --save-dev npm in ...

  10. React兄弟组件通信

    1.在父组件定义好回调函数接收组件A传过来的值 // 引入组件 import SonA from "./components/SonA" import SonB from &quo ...

最新文章

  1. BZOJ2244 [SDOI2011]拦截导弹 【cdq分治 + 树状数组】
  2. 2020年PMCAFF大咖分享合集(有回放)
  3. 如何做好 Android 端音视频测试?
  4. eureka服务失效剔除时长配置
  5. 前端学习(495):嵌入代码与外部文件和文档模式
  6. 用cin解决有时输入两个,有时输三个变量
  7. win远程桌面连接服务器,远程桌面连接windows服务器
  8. 计量单位报错:消息号BM302 “未使用语言 ZH 创建单位 XXX”
  9. Echarts 大数据可视化基本使用
  10. python包NetworkX学习——最短路径dijkstra_path和dijkstra_path_length
  11. [摘录]第二部分 战略决策(1)
  12. 软文标题怎么写?这8种标题写法你用对了吗
  13. AD_PCB 快捷键
  14. Unity基础 Unity获取当前时间的时间戳
  15. C++中set容器的基本使用----在B站听黑马程序员c++课程的记录
  16. 计算机学院早操规定,数学和计算机学院学生会体育部早操管理制度.doc
  17. 西门子s1200教程_如何进行西门子的S-1200的S7单边通讯图文详解
  18. 中华老黄历下载手机版免费_「 中华老黄历 」中华老黄历(手机老黄历)新版下载 - U大师...
  19. 中国高等医学教育 杂志介绍
  20. 怎么把产品内容做得更吸引用户?

热门文章

  1. 计算机网络(HTTP、TCP/IP、UDP)详解-面试篇
  2. 中国舷外机行业研究与投资战略报告(2021版)
  3. 运用js在网页中输出九九乘法表 (带边框)(附代码)
  4. @ExceptionHandler全局异常捕获响应体返回中文乱码
  5. matlab设置启动画面,为Matlab的GUI添加启动画面
  6. 解决“尝试执行未经授权的操作”问题
  7. wlan macaddress加载
  8. springcloud之eureka集群
  9. android camera 图片被旋转,android 部分手机Camera 拍照 图片被旋转90度的解决方法
  10. UI5(三)Component.js. manifest.json应用程序描配置