vue3 父子组件传值 记录

news2024/11/19 5:30:51

最近这个组件之间传值用的较多,我这该死的记性,总给忘记写法,特此记录下

在这里插入图片描述

第一种 父传子

补充:LeftView.vue 是父组件; Video.vue 是子组件
在这里插入图片描述
在这里插入图片描述

第二种 子传父

Video.vue 子组件

第一步 引入:
import { defineEmits } from 'vue'

第二步 命名:
const emit = defineEmits(['func'])

第三步 传递:
emit('func', value)

LeftView.vue 父组件
在这里插入图片描述

第三种 组件通用传值EventBus

第一步 创建bus.js文件

--bus.js

import mitt from "mitt";
const emitter = mitt()
export default emitter

第二步 分别在需要相互传参的组件中引入bus.js文件,并相互传参
在这里插入图片描述
在这里插入图片描述

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

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

Linux搭建Discuz论坛

环境:redhat 9 mysql 8 Discuz 3.5 题目要求:在 bbs.example.com 主机上创建 Discuz 论坛,数据库服务器使用 db.example.com 主机的 bbs 数据库实例,该实例由 MySQL数据库软件提供服务。 题目要求没有说是在一台虚拟机…

PostgreSQL学习笔记

目录 一、PostgreSQL安装 1、下载 2、安装 二、PostgreSQL操作 1、数据库操作 2、表操作 3、数据操作 一、PostgreSQL安装 本章节以windows系统安装为例,讲解PostgreSQL 15.0的安装过程。 1、下载 访问PostgreSQL官方网站,下载对应的安装包&am…

Qt/C++编写超精美自定义控件(历时9年更新迭代/超202个控件/祖传原创)

一、前言 无论是哪一门开发框架,如果涉及到UI这块,肯定需要用到自定义控件,越复杂功能越多的项目,自定义控件的数量就越多,最开始的时候可能每个自定义控件都针对特定的应用场景,甚至里面带了特定的场景的…

多元回归预测 | Matlab基于麻雀算法(SSA)优化混合核极限学习机HKELM回归预测, SSA-HKELM数据回归预测,多变量输入模型

文章目录 效果一览文章概述部分源码参考资料效果一览 文章概述 多元回归预测 | Matlab基于麻雀算法(SSA)优化混合核极限学习机HKELM回归预测, SSA-HKELM数据回归预测,多变量输入模型 评价指标包括:MAE、RMSE和R2等,代码质量极高,方便学习和替换数据。要求2018版本及以上。 …

Idea中使用Git详细教学

目录 一、配置 Git 二、创建项目远程仓库 三、初始化本地仓库 方法一: 方法二: 四、连接远程仓库 五、提交与拉取到本地仓库 六、推送到远程仓库 七、克隆远程仓库到本地 方法一: 方法二: 八、Git分支操作 一、配置 G…

GAMES101笔记 Lecture07 Shading1(Illumination, Shading and Graphics Pipeline)

目录 Visibility / Occlusion(可见性 or 遮挡)Painters Algorithm(画家算法)Z-Buffer(深度缓冲算法) Shading(着色)A Simple Shading Model(Blinn-Phong Reflectance Model)一个简单的着色模型:Blinn-Phong反射模型Diffuse Reflection(漫反射) 参考资源 Visibility …

Learn Mongodb了解DB数据库 ①

作者 : SYFStrive 博客首页 : HomePage 📜: PHP MYSQL 📌:个人社区(欢迎大佬们加入) 👉:社区链接🔗 📌:觉得文章不错可以点点关注 &#x1f44…

flash attention论文及源码学习

​ 论文 attention计算公式如下 传统实现需要将S和P都存到HBM,需要占用 O ( N 2 ) O(N^{2}) O(N2)内存,计算流程为 因此前向HBM访存为 O ( N d N 2 ) O(Nd N^2) O(NdN2),通常N远大于d,GPT2中N1024,d64。HBM带宽…

#10043. 「一本通 2.2 例 1」剪花布条(内附封面)

题目描述 原题来自:HDU 2087 一块花布条,里面有些图案,另有一块直接可用的小饰条,里面也有一些图案。对于给定的花布条和小饰条,计算一下能从花布条中尽可能剪出几块小饰条来呢? 输入格式 输入数据为多…

23年6月1日软著又面临改革,个人加分评职称和企业申报项目加分的软件著作权登记证书该如何申请?

23年6月1号,国家版权局对软件著作权的申请又做出了改革,本次改革的主要内容是全面普及线上办公。申请人无需向中心递交或邮寄登记申请纸介质材料,“足不出户”即可完成版权登记。 软件著作权登记实现无纸化后,申请人在线登记办理…

1.2g可视化大屏项目分享【包含数字孪生、视频监控、智慧城市、智慧交通等】

1.2g可视化大屏项目分享【包含数字孪生、视频监控、智慧城市、智慧交通等】 链接:https://pan.baidu.com/s/1KSNll7b6bVoVPPqcQmNKeQ 提取码:w13x

Android 图形系统-图解和初步探究

Android 图形系统-图解和初步探究_猎羽的博客-CSDN博客https://blog.csdn.net/feather_wch/article/details/131486729 Android图形系统 2023-7-1 问题:如何将一帧画面显示到屏幕上? 绘制流程 Activity代码 Window的结构 绘制流程 Activity启动后&a…

JDK 动态代理为什么只能代理有接口的类?

嗯,这个问题的核心本质,是 JDK 动态代理本身的机制来决定的。 首先,在 Java 里面,动态代理是通过 Proxy.newProxyInstance()方法来实现的,它需 要传入被动态代理的接口类。 之所以要传入接口,不能传入类&a…

MYSQL增删改语句

INSERT 语法: 单行插入 INSERT INTO table_name (column_1, column_2, ...) VALUES (value_1, value_2, ...); 多行插入 INSERT INTO table_name (column_1, column_2, ...) VALUES (value_11, value_12, ...),(value_21, value_22, ...)...; INSERT INTO 和 VALUES都是关键词 …

libGL.so.1: cannot open shared object file: No such file or directory

不适用docker环境,在conda虚拟环境中出现如下错误: 解决办法: 参考资料 【解决方法】libGL.so.1: cannot open shared object file: No such file or directory

高性能分布式缓存Redis(三) 扩展应用

一、分布式锁 在并发编程中&#xff0c;通过锁&#xff0c;来避免由于竞争而造成的数据不一致问题 1.1、高并发下单超卖问题 Autowired RedisTemplate<String, String> redisTemplate;String key "maotai20210319001";//茅台商品编号ScheduledExecutorServ…

【线程池】史上最全的ScheduledThreadPoolExecutor源码分析

目录 一、简介 1.1 继承关系 1.2 使用 1.3 例子 二、源码分析 2.1 构造方法 2.2 主要的四种提交执行任务的方法 2.3 内部类 ScheduledFutureTask 2.3 scheduleAtFixedRate()方法 2.4 delayedExecute()方法 2.5 ScheduledFutureTask类的run()方法 2.6 内部类 Delaye…

Java设计模式(九)—— 工厂模式1

系列文章目录 披萨订购—传统方式 文章目录 系列文章目录前言一、传统方式案例1.具体需求案例2.传统方式实现3.传统方式优缺点 总结 前言 Hello&#xff0c;小伙伴们&#xff0c;欢迎来到柚子的博客~让我们一起成长吧o(&#xffe3;▽&#xffe3;)ブ 提示&#xff1a;以下是…

Java框架学习(一)JavaWeb基础:Maven、Spring、Tomcat、Mybatis、Springboot

文章目录 MavenMaven仓库Maven坐标为什么Maven进行了依赖管理&#xff0c;依然会出现依赖冲突&#xff1f;处理依赖冲突的手段是什么&#xff1f;详细讲讲scope依赖范围Maven的生命周期Maven高级分模块设计继承版本锁定聚合Maven的继承与聚合的异同私服 Tomcatservlet 分层解耦…

RISCV Reader笔记_4 乘除,浮点扩展

乘法和除法指令 前面了解过 RV32I不带乘除。扩展的RV32M里面有。 mul 较简单。div 是商&#xff0c;rem 是余数。 指令格式都差不多&#xff0c;基本就是靠 func 码确定变体。 因为两个32位数乘积是64位数&#xff0c;一条指令处理会比较复杂&#xff0c;因此分为两个指令计算…