Vue3通过$emit实现子向父传递数据
引言
子组件通过$emit触发事件,并传递数据,父组件在使用子组件时就可以绑定子组件事件,在事件处理函数中拿到子组件传来的数据
子组件传递数据
函数声明:$emit('事件名', 传递的数据 . . .)
子组件传递的数据会依次传递给父组件的事件函数
使用:
① 在html标签中使用
直接执行$emit()函数即可
<!-- 子组件名为search -->
<template><view class="root"><input type="text"><view class="search" @click="$emit('search', 100)">搜索</view></view>
</template>
② 在 js 代码中使用
-
通过defineEmits()函数定义事件
-
拿到返回对象触发事件
<!-- 子组件名为search -->
<template><view><view class="root"><input type="text"><view class="search" @click="search">搜索</view></view></view>
</template>
<script setup>import {defineEmits} from 'vue';// 定义事件const emit = defineEmits(['search'])// 触发事件的函数const search = () => {// 触发该组件的search事件emit('search', 100)}
</script>
父组件接收数据
绑定子组件定义的事件,通过事件处理函数的参数获取传来的数据
<template><view class="root"><!-- 绑定事件函数 --><search @search="getSearchData"></search></view>
</template>
<script setup>const getSearchData = (data) => {// 拿到子组件传递来的数据console.log(data)}
</script>
相关文章:
Vue3通过$emit实现子向父传递数据
引言 子组件通过$emit触发事件,并传递数据,父组件在使用子组件时就可以绑定子组件事件,在事件处理函数中拿到子组件传来的数据 子组件传递数据 函数声明:$emit(事件名, 传递的数据 . . .) 子组件传递的数据会依次传递给父组件的…...
代码随想录算法训练营第十四天|递归 226.翻转二叉树 101. 对称二叉树 104.二叉树的最大深度 111.二叉树的最小深度
226.翻转二叉树 翻转一棵二叉树。 思路: 在这里需要注意的是,在递归的时候唯独中序遍历是不可用的,这是因为先对左子树进行了反转,又对自身进行了反转,对自身反转后原本的左子树变成了右子树,如果此时又轮…...
Spark 任务与 Spark Streaming 任务的差异详解
Spark 任务与 Spark Streaming 任务的主要差异源自于两者的应用场景不同:Spark 主要处理静态的大数据集,而 Spark Streaming 处理的是实时流数据。这些差异体现在任务的调度、执行、容错、数据处理模式等方面。 接下来,我们将从底层原理和源…...
Git提示信息 Pulling is not possible because you have unmerged files.
git [fatal] hint: Pulling is not possible because you have unmerged files.hint: Fix them up in the … error: Pulling is not possible because you have unmerged files. 错误:无法提取,因为您有未合并的文件。 hint: Fix them up in the work tree, and t…...
python编程开发“人机猜拳”游戏
👨💻个人主页:开发者-曼亿点 👨💻 hallo 欢迎 点赞👍 收藏⭐ 留言📝 加关注✅! 👨💻 本文由 曼亿点 原创 👨💻 收录于专栏:…...
丹摩智算平台部署 Llama 3.1:实践与体验
文章目录 前言部署前的准备创建实例 部署与配置 Llama 3.1使用心得总结 前言 在最近的开发工作中,我有机会体验了丹摩智算平台,部署并使用了 Llama 3.1 模型。在人工智能和大模型领域,Meta 推出的 Llama 3.1 已经成为了目前最受瞩目的开源模…...
SpringCloud 2023各依赖版本选择、核心功能与组件、创建项目(注意事项、依赖)
目录 1. 各依赖版本选择2. 核心功能与组件3. 创建项目3.1 注意事项3.2 依赖 1. 各依赖版本选择 SpringCloud: 2023.0.1SpringBoot: 3.2.4。参考Spring Cloud Train Reference Documentation选择版本 SpringCloud Alibaba: 2023.0.1.0*: 参考Spring Cloud Alibaba选择版本。同时…...
串行化执行、并行化执行
文章目录 1、串行化执行2、并行化测试(多线程环境)3、任务的执行是异步的,但主程序的继续执行是同步的 可以将多个任务编排为并行和串行化执行。 也可以处理编排的多个任务的异常,也可以返回兜底数据。 1、串行化执行 顺序执行、…...
二叉搜索树(c++版)
前言 在前面我们介绍过二叉树这个数据结构,今天我们更进一步来介绍二叉树的一种在实现中运用的场景——二叉搜索树。二叉搜索树顾名思义其在“搜索”这个场景下有不俗的表现,之所以会这样是因为它在二叉树的基础上添加了一些属性。下面我们就来简单的介…...
每日1题-7
...
简单实现log记录保存到文本和数据库
简单保存记录到txt,sqlite数据库,以及console监控记录 using System; using System.Collections.Generic; using System.ComponentModel; using System.Text; using System.Data.SQLite; using System.IO;namespace NlogFrame {public enum LogType{Tr…...
敏感字段加密 - 华为OD统一考试(E卷)
2024华为OD机试(E卷+D卷+C卷)最新题库【超值优惠】Java/Python/C++合集 题目描述 【敏感字段加密】给定一个由多个命令字组成的命令字符串: 1、字符串长度小于等于127字节,只包含大小写字母,数字,下划线和偶数个双引号; 2、命令字之间以一个或多个下划线 进行分割; 3、可…...
go 安装三方库
go版本 go versiongo version go1.23.1 darwin/arm64安装 redis 库 cd $GOPATH说明: 这里可以改 GOPATH的值 将如下 export 语句写入 ~/.bash_profile 文件中 export GOPATH/Users/goproject然后使其生效 source ~/.bash_profile初始化生成 go.mod 文件 go mod…...
Java 中的 volatile和synchronized和 ReentrantLock区别讲解和案例示范
在 Java 的并发编程中,volatile、synchronized 和 ReentrantLock 是三种常用的同步机制。每种机制都有其独特的特性、优缺点和适用场景。理解它们之间的区别以及在何种情况下使用哪种机制,对提高程序的性能和可靠性至关重要。本文将详细探讨这三种机制的…...
从GDAL中 读取遥感影像的信息
从GDAL提供的实用程序来看,很多程序的后缀都是 .py ,这充分地说明了Python语言在GDAL的开发中得到了广泛的应用。 1. 打开已有的GeoTIF文件 下面我们试着读取一个GeoTiff文件的信息。第一步就是打开一个数据集。 >>> from osgeo import gdal…...
算法闭关修炼百题计划(一)
多看优秀的代码一定没有错,此篇博客属于个人学习记录 1.两数之和2.前k个高频元素3.只出现一次的数字4.数组的度5.最佳观光组合6.整数反转7.缺失的第一个正数8.字符串中最多数目的子序列9.k个一组翻转链表10.反转链表II11. 公司命名12.合并区间13.快速排序14.数字中的…...
vue3实现打字机的效果,可以换行
之前看了很多文章,效果是实现了,就是没有自动换行的效果,参考了文章写了一个,先上个效果图,卡顿是因为模仿了卡顿的效果,还是很丝滑的 目录 效果图:代码如下 效果图: 函数查找原因是FLASH Programming Sequence error(编程顺序错误),解决办法是在解锁后清零标志位…...
Android—ANR日志分析
获取ANR日志: ANR路径:/data/anrADB指令:adb bugreport D:\bugrep.zip ANR日志分析步骤: “main” prio:主线程状态beginning of crash:搜索 crash 相关信息CPU usage from:搜索 cpu 使用信息…...
告别esptool失败!用乐鑫官方Flash工具给ESP8266刷MicroPython固件(保姆级图文)
ESP8266刷机新选择:乐鑫官方Flash工具全流程指南 为什么选择官方工具替代esptool? 每次看到命令行里跳出的红色报错信息,是不是有种想把开发板扔出窗外的冲动?"端口不存在"、"擦除失败"、"权限不足"…...
VRM-VRChat双向转换引擎:打破虚拟角色平台壁垒的技术解决方案
VRM-VRChat双向转换引擎:打破虚拟角色平台壁垒的技术解决方案 【免费下载链接】VRMConverterForVRChat 项目地址: https://gitcode.com/gh_mirrors/vr/VRMConverterForVRChat VRM格式转换、VRChat SDK3兼容、Unity编辑器扩展、虚拟角色迁移、跨平台角色转换…...
uni-number-box深度解析:从基础属性到高级双向绑定实战
1. uni-number-box基础入门:从零开始玩转数字输入框 第一次接触uni-number-box时,我也觉得这不就是个简单的数字加减控件吗?直到在电商项目中真正用起来,才发现这个看似简单的组件藏着不少门道。uni-number-box是uni-app框架提供的…...
ncmdump工具完全攻略:解锁网易云音乐NCM格式转换的终极指南
ncmdump工具完全攻略:解锁网易云音乐NCM格式转换的终极指南 【免费下载链接】ncmdump 项目地址: https://gitcode.com/gh_mirrors/ncmd/ncmdump 还在为网易云音乐下载的NCM加密格式无法在其他播放器播放而烦恼吗?你是否经历过精心收藏的音乐只能…...
应急通信无人机中继部署与覆盖率优化【附仿真】
✨ 长期致力于应急通信、无人机、中继部署、通信覆盖率、无人机部署数目研究工作,擅长数据搜集与处理、建模仿真、程序编写、仿真设计。 ✅ 专业定制毕设、代码 ✅如需沟通交流,点击《获取方式》 (1)视距概率信道建模与高度部署&a…...
时间序列预测总翻车?试试用Python实现嵌套交叉验证来守住‘未来’数据
时间序列预测中的嵌套交叉验证:用Python守住数据的时间壁垒 当你在预测下周的销售额、下个月的电力负荷或明天的股价时,最可怕的不是模型不够复杂,而是它偷偷"作弊"了——通过窥探未来的数据来假装自己很聪明。这种时间序列预测中的…...
Windows系统mmcndmgr.dll文件丢失无法启动程序解决
在使用电脑系统时经常会出现丢失找不到某些文件的情况,由于很多常用软件都是采用 Microsoft Visual Studio 编写的,所以这类软件的运行需要依赖微软Visual C运行库,比如像 QQ、迅雷、Adobe 软件等等,如果没有安装VC运行库或者安装…...
ARM AMBA总线演进史:从AHB到AXI,再到CHI和ACE,我们经历了什么?
ARM AMBA总线演进史:从AHB到AXI,再到CHI和ACE的技术脉络解析 二十年前,当ARM首次提出AMBA总线架构时,恐怕很少有人能预见它会在今天的SoC设计中占据如此核心的地位。从最初的AHB到如今的CHI,AMBA总线的每一次迭代都精准…...
【紧急预警】PlayAI新政策已生效!ElevenLabs未披露的商用语音水印机制曝光——2024年AI语音合规红线与替代方案速览(仅剩72小时窗口期)
更多请点击: https://intelliparadigm.com 第一章:【紧急预警】PlayAI新政策已生效!ElevenLabs未披露的商用语音水印机制曝光——2024年AI语音合规红线与替代方案速览(仅剩72小时窗口期) 水印机制逆向验证结果 通过对…...
新加坡高校 Canvas 攻击事件影响评估与安全治理研究
摘要 2026 年 5 月发生的 Canvas 学习平台全球供应链攻击事件,对新加坡国立大学、新加坡社科大学、新加坡管理学院等高校造成服务中断与数据泄露风险,成为教育数字化场景下第三方平台安全风险的典型案例。本次攻击由 Shiny Hunters 组织实施,…...
