当前位置：首页 > news >正文

Vue3 + TypeScript中defineEmits 类型定义解析

news 来源：原创 2025/8/10 12:57:40

TypeScript 中 Vue 3 的 defineEmits 函数的类型定义，用于声明组件可以触发的事件。以下是分步解释：

1. 泛型定义

<"closeDialog" | "getApplySampleAndItemX">

作用：定义允许的事件名称集合，即组件只能触发 closeDialog 或 getApplySampleAndItemX 两个事件。
说明：这是一个泛型参数，限定事件名必须为这两个字符串字面量类型之一。

2. 函数参数

(emitOptions: ("closeDialog" | "getApplySampleAndItemX")[])

作用：接受一个事件名数组作为参数（如 ['closeDialog']）。
说明：emitOptions 是事件名的数组，用于运行时声明组件支持的事件。

3. 返回值函数

(event: "closeDialog" | "getApplySampleAndItemX", ...args: any[]) => void

作用：返回一个 emit 函数，用于触发事件。
- event：要触发的事件名，必须是泛型定义中的事件。
- ...args：事件的参数（类型宽松，允许任意参数）。
说明：调用 emit('closeDialog') 或 emit('getApplySampleAndItemX', arg1, arg2) 时，参数类型不会被严格约束（因 args 是 any[]）。

4. 重载（+2 overloads）

作用：提供多种类型定义，以适应不同使用场景。
- 场景一：运行时声明（传入事件名数组，参数宽松）。
  
  ts
```
defineEmits(['closeDialog'])
```
- 场景二：类型声明（通过接口定义事件参数类型，类型严格）。
  
  ts
```
defineEmits<{(e: 'closeDialog'): void;(e: 'getApplySampleAndItemX', sample: string, item: number): void;
}>()
```
- 场景三：可能其他配置方式（如混合使用或额外选项）。

总结

用途：在 Vue 组件中定义可触发的事件。
两种用法：
1. 运行时声明：传入字符串数组，参数类型宽松。
2. 类型声明：通过接口定义事件及参数类型，实现严格类型检查。
代码中的类型：对应运行时声明，允许任意参数（any[]），而重载覆盖了类型声明等场景，提供更灵活的类型支持。

示例

typescript

// 运行时声明（参数宽松）
const emit = defineEmits(['closeDialog', 'getApplySampleAndItemX']);
emit('closeDialog'); // 正确
emit('getApplySampleAndItemX', 123, 'abc'); // 参数类型不检查// 类型声明（参数严格）
const emitStrict = defineEmits<{(e: 'closeDialog'): void;(e: 'getApplySampleAndItemX', sample: string, item: number): void;
}>();
emitStrict('getApplySampleAndItemX', 'sample', 123); // 参数类型匹配
emitStrict('getApplySampleAndItemX', 123, 'sample'); // 错误：参数类型不匹配

通过重载，defineEmits 能同时支持灵活和严格的类型检查，适应不同开发需求。

Vue3 + TypeScript中defineEmits 类型定义解析

TypeScript 中 Vue 3 的 defineEmits 函数的类型定义，用于声明组件可以触发的事件。以下是分步解释： 1. 泛型定义 ts <"closeDialog" | "getApplySampleAndItemX"> 作用：定义允许的事件名称集合，即组…...

编程日记 2025/8/10 12:57:40

Git命令归纳

初始化git git config --global user.name xxx：设置全局用户名，信息记录在~/.gitconfig文件中git config --global user.email xxxxxx.com：设置全局邮箱地址，信息记录在~/.gitconfig文件中git init：先创建一个目录&am…...

编程日记 2025/8/7 7:56:53

Oracle Recovery Tools修复ORA-600 6101/kdxlin:psno out of range故障

数据库异常断电,然后启动异常,我接手该库,尝试recover恢复 SQL> recover database; ORA-10562: Error occurred while applying redo to data block (file# 2, block# 63710) ORA-10564: tablespace SYSAUX ORA-01110: ???????? 2: H:\TEMP\GDLISNET\SYSAUX01.DBF O…...

编程日记 2025/7/30 21:47:22

ISO26262-浅谈用例导出方法和测试方法

目录 1 摘要2 测试方法3 测试用例导出方法4 测试方法与用例导出方法的差异和联系5 结论 1 摘要 ISO26262定义了测试方法和用例导出方法，共同保证产品的开发质量。但在刚开始学习ISO26262的时候，又不是非常清晰地理解它俩的区别和联系。本文主要对它俩的…...

编程日记 2025/8/10 12:55:07

小测验——已经能利用数据集里面的相机外参调整后看到渲染图像

文章目录 .1 外try——牛的显示.2 try——衣服的显示.3 原生R，T但是部分显示.4 在.3的基础上加上可视化界面.5 调参后能看到东西的.6 能看一点东西+可视化（pytorch3d）.7 自己的代码可视化——需要调整.1 外try——牛的显示 import numpy as np import matplotlib.pyplot as …...

编程日记 2025/8/10 12:53:03

2024期刊综述论文 Knowledge Graphs and Semantic Web Tools in Cyber Threat Intelligence

发表在期刊Journal of Cybersecurity and Privacy上，专门讲知识图谱技术和语义Web工具在网络威胁情报领域的作用，还把本体和知识图谱放在相同的地位上讨论。此处可以明确一点：本体和知识图谱都可以用于网络威胁情报的应用，当然也…...

编程日记 2025/8/5 18:29:16

文件上传及验证绕过漏洞

目录一、文件上传常见点二、客户端--JS绕过--PASS-01 1、环境安装 2、禁用JS 3、后缀名绕过 4、修改前端代码三、服务端黑名单绕过 1、特殊可解析后缀--PASS-03 2、大小写绕过--PASS-06 3、点绕过--PASS-08 4、空格绕过--PASS-07 5、::$DATA绕过--PASS-09 6、配…...

编程日记 2025/8/10 12:55:44

stack和queue的使用和模拟实现

1：stack文档 stack文档 stack的使用 2：queue文档 queue文档 queue的使用 1：队列是一种容器适配器，专门用于在FIFO上下文(先进先出)中操作，其中从容器一端插入元素，另一端提取元素。 2：队列作…...

编程日记 2025/8/10 12:55:05

基于Ubuntu2504部署OpenStack E版

OpenStack 初始化环境安装数据库、memcahe、rabbitmq等服务安装keystone服务安装glance服务安装placement服务安装nova服务安装neutron服务安装horizon服务官网 OpenStack Epoxy 巩固了作为 VMware 替代方案的地位，增强了安全性，并改进了硬件支持第 3…...

编程日记 2025/8/10 12:53:35

Jsp技术入门指南【七】JSP动作讲解

Jsp技术入门指南【七】JSP动作讲解前言一、什么是JSP动作？二、核心JSP动作详解1. jsp:include：动态包含其他页面与<% include %>的区别 2. jsp:forward：请求转发到另一个页面3. jsp:param：为动作传递参数4. jsp:useBean&am…...

编程日记 2025/8/9 22:28:38

电脑访问 github提示找不到网页，处理方案

1、找到本机的 host文件例如 windows 的一般在 C:\Windows\System32\drivers\etc\hosts 用管理员身份打开 hosts 文件如果文件中没有 github的配置，需要自己手动添加上去； 如果有，则需要检查 github.com 与 github.global.ssl.fastly.…...

编程日记 2025/8/4 20:07:28

性能比拼: Elixir vs Go

本内容是对知名性能评测博主 Anton Putra Elixir vs Go (Golang) Performance (Latency - Throughput - Saturation - Availability) 内容的翻译与整理, 有适当删减, 相关指标和结论以原作为准对比 Elixir 和 Go 简介许多人长期以来一直要求我对比 Elixir 和 Go。在本视频…...

编程日记 2025/8/4 22:16:01

动手实现文本生成模型：基于 Decoder-only Transformer (PyTorch)

1. 选择框架：PyTorch 我们选择 PyTorch 作为实现框架。PyTorch 提供了灵活的动态图，并且拥有功能强大的 nn.Transformer 模块，方便我们快速构建模型。其社区活跃，资源丰富，是进行深度学习研究和开发的优秀选择。确保你已经安装了 PyTorch 和其他必要的库： Bash pip i…...

编程日记 2025/8/2 17:18:21

WSL+Ubuntu+miniconda环境配置

安装到指定目录 bash Miniconda3-latest-Linux-x86_64.sh -b -p /usr/local/miniconda3添加环境变量 echo export PATH"/usr/local/miniconda3/bin:$PATH" >> /etc/profile echo export PATH"/usr/local/miniconda3/bin:$PATH" >> ~/.bashrc…...

编程日记 2025/8/8 18:48:22

linux学习 5 正则表达式及通配符

重心应该放在通配符的使用上正则表达式正则表达式是用于文本匹配和替换的强大工具介绍两个交互式的网站来学习正则表达式 regexlearn 支持中文 regexone 还有一个在线测试的网址 regex101 基本规则符号作用示例.匹配任何字符除了换行a.b -> axb/a,b[abc]匹配字符…...

编程日记 2025/8/9 19:25:28

【web服务_负载均衡Nginx】三、Nginx 实践应用与高级配置技巧

一、Nginx 在 Web 服务器场景中的深度应用 1.1 静态网站部署与优化在 CentOS 7 系统中，使用 Nginx 部署静态网站是最基础也最常见的应用场景。首先，准备网站文件，在/var/www/html目录下创建index.html文件： sudo mkdir -p…...

编程日记 2025/8/8 14:52:17

详解与HTTP服务器相关操作

HTTP 服务器是一种遵循超文本传输协议（HTTP）的服务器，用于在网络上传输和处理网页及其他相关资源。以下是关于它的详细介绍： 工作原理 HTTP 服务器监听指定端口（通常是 80 端口用于 HTTP，443 端口用于 HT…...

编程日记 2025/7/30 13:57:53

LeetCode 2563.统计公平数对的数目：排序 + 二分查找

【LetMeFly】2563.统计公平数对的数目：排序二分查找力扣题目链接：https://leetcode.cn/problems/count-the-number-of-fair-pairs/ 给你一个下标从 0 开始、长度为 n 的整数数组 nums ，和两个整数 lower 和 upper ，返回公平…...

编程日记 2025/8/6 19:16:18

Manus技术架构、实现内幕及分布式智能体项目实战

Manus技术架构、实现内幕及分布式智能体项目实战模块一： 剖析Manus分布式多智能体全生命周期、九大核心模块及MCP协议，构建低幻觉、高效且具备动态失败处理能力的Manus系统。模块二： 解析Manus大模型Agent操作电脑的原理与关键API&#xf…...

编程日记 2025/7/30 21:46:54

基于springboot的个人财务管理系统的设计与实现

博主介绍：java高级开发，从事互联网行业六年，熟悉各种主流语言，精通java、python、php、爬虫、web开发，已经做了六年的毕业设计程序开发，开发过上千套毕业设计程序，没有什么华丽的语言&#xff0…...

编程日记 2025/8/4 7:47:06

新能源汽车动力电池热管理方案全解析：开启电车续航与安全的密码

热管理：新能源汽车的隐形守护者在新能源汽车飞速发展的今天，热管理系统作为保障车辆核心部件稳定运行的关键，正逐渐成为行业关注的焦点。据市场研究机构的数据显示，近年来新能源汽车的销量持续攀升，而与之相伴的是热…...

编程日记 2025/8/10 7:55:47

Ubuntu开启自启动PostgreSQL读取HDD失败处理思路

前置文章： windows通用网线连接ubuntu实现ssh登录、桌面控制、文件共享Ubuntu挂载HDD迁移存储PostgreSQL数据背景： 启动实体Ubuntu机器后后很大的概率PostgreSQL不会成功启动，查看日志： Ubuntu启动时间： rootPine…...

编程日记 2025/8/8 9:57:35

损失函数总结

目录回归问题L1损失平均绝对值误差（MAE）Smooth L1 LossL2损失均方误差损失MSE 分类问题交叉熵损失KL 散度损失 KLDivLoss负对数似然损失 NLLLoss 排序MarginRankingLoss 回归问题 L1损失平均绝对值误差（MAE） 指模型预测值f(x…...

编程日记 2025/7/30 21:46:50

LeetCode 热题 100：回溯

46. 全排列给定一个不含重复数字的数组 nums ，返回其所有可能的全排列。你可以按任意顺序返回答案。示例 1： 输入：nums [1,2,3] 输出：[[1,2,3],[1,3,2],[2,1,3],[2,3,1],[3,1,2],[3,2,1]]示例 2： 输入&#xff…...

编程日记 2025/8/3 5:19:22

Jetson Orin NX 部署YOLOv12笔记

步骤一.创建虚拟环境 conda create -n yolov12 python3.8.20 注意：YOLOv12/YOLOv11/YOLOv10/YOLOv9/YOLOv8/YOLOv7a/YOLOv5 环境通用步骤二.激活虚拟环境 conda activate yolov12 #激活环境步骤三.查询Jetpack出厂版本 Jetson系列平台各型号支持的最高Jetp…...

编程日记 2025/8/4 21:22:19

『Linux_网络』第二章 UDP_Socket编程

学习了网络的概念了，接下来我们开始实践，本次我们会通过UDP来模拟实现UDP客户端和UDP服务器之间的通信，以及在此基础上扩展几个应用。下面，我们将使用socket，bind，htons等接口实现UDP网络通信。 v1 版本 …...

编程日记 2025/8/10 1:38:59

【leetcode刷题日记】lc.322-零钱兑换

目录 1.题目 2.代码 1.题目给你一个整数数组 coins ，表示不同面额的硬币；以及一个整数 amount ，表示总金额。计算并返回可以凑成总金额所需的最少的硬币个数。如果没有任何一种硬币组合能组成总金额，返回 -1 。你可以认…...

编程日记 2025/8/4 1:56:06

从GET到POST：HTTP请求的攻防实战与CTF挑战解析

初探HTTP请求：当浏览器遇见服务器基础协议差异可视化 # 典型GET请求 GET /login.php?username=admin&password=p@ssw0rd HTTP/1.1 Host: example.com User-Agent: Mozilla/5.0# 典型POST请求 POST /login.php HTTP/1.1 Host: example.com Content-Type: application/x…...

编程日记 2025/8/6 22:19:43

实现Azure Data Factory安全地请求企业内部API返回数据

需要配置一个Web Activity组件在Azure云上的Azure Data Factory运行，它需要访问企业内部的API获取JSON格式的数据，企业有网关和防火墙，API有公司的okta身份认证，通过公司的域账号来授权访问，现在需要创建一个专用的域账…...

编程日记 2025/8/5 16:18:51

JDOM处理XML：Java程序员的“乐高积木2.0版“

各位代码建筑师们！今天我们要玩一款比原生DOM更"Java友好"的XML积木套装——JDOM！它像乐高得宝系列（Duplo）一样简单易用，却能让你的XML工程稳如霍格沃茨城堡！（温馨提示：别…...

编程日记 2025/8/5 7:17:20

Grouped Query Attention (GQA) PyTorch实现

个人在网上看到的实现好像都长得奇奇怪怪的，没有简洁的感觉，因此在这里给出一种易读的GQA实现方法： import torch import torch.nn as nn import torch.nn.functional as Fclass GroupedQueryAttention(nn.Module):def __init__(self, embed…...

编程日记 2025/8/8 19:27:38

《AI大模型应知应会100篇》第27篇：模型温度参数调节：控制创造性与确定性

第27篇：模型温度参数调节：控制创造性与确定性摘要在大语言模型的使用中，“温度”（Temperature）是一个关键参数，它决定了模型输出的创造性和确定性之间的平衡。通过调整温度参数，您可以根据任…...

编程日记 2025/7/31 0:23:38

演讲比赛流程管理项目c++

对于一个基本项目，先分析基本的东西有哪些 1.类演讲管理类:用于编写比赛流程用的功能演讲者类：包含姓名，分数创建比赛流程：创建选手12个人，分为两组，6人一组，每组进行两轮比赛&#xff0…...

编程日记 2025/8/6 19:27:04

在小米AX6000中通过米家控制tailscale

由于tailscale占用内存较大，AX6000中的可用内存非常有限，所以需要对AX6000的内存使用进行优化： 1.减小tmpfs内存占用的大小： #从150M -> 90M，由于tailscale下载安装包是27M作用， 解压后50M左右&#xf…...

编程日记 2025/8/5 14:52:09

REC: 引爆全球万亿级市场！Web3+消费革命重塑全球-东南亚-跨境商业未来

在全球数字经济浪潮下，东南亚已成为增长最快的互联网市场之一，其与全球之间蓬勃发展的跨境贸易更是蕴藏着巨大潜力。然而，传统模式下的效率瓶颈、信任壁垒和用户激励难题日益凸显。在此背景下，基于去中心化与消费相结合的 REC 颠覆…...

编程日记 2025/8/10 1:39:03

微服务与事件驱动架构（EDA）

微服务架构微服务架构核心特征服务自治：每个服务拥有独立的代码库、数据库和运维流程。轻量级通信：服务间通过API（REST/gRPC）或消息队列（如Kafka）交互。去中心化治理：允许技术栈多样化&…...

编程日记 2025/8/3 14:45:24

单片机如何通过串口与上位机进行数据交换

单片机通过串口与上位机进行数据交换是一种常见的方式，广泛应用于嵌入式系统中。以下是实现这一功能的具体步骤和注意事项： 1. 硬件连接在硬件层面，需要确保单片机和上位机之间的串口连接正确： 信号线连接：通常使用…...

编程日记 2025/8/6 8:45:24

AI速读 Seed-Thinking-v1.5：大模型推理的新飞跃

在大语言模型（LLM）蓬勃发展的今天，推理模型的性能提升成为了AI领域的关键议题。今天为大家解读的论文，带来了名为Seed-Thinking-v1.5的推理模型，它在多个任务上表现惊艳，还创新性地解决了不少难题&#xff…...

编程日记 2025/8/8 15:31:03

Mysql从入门到上手(二)-全面了解增删改查(CRUD).

一、检索数据 MySQL 中的检索数据操作是数据库操作中最常见的任务之一。使用 SQL 查询语言中的 SELECT 语句，可以从数据库中的一个或多个表中检索数据。以下是 MySQL 中与数据检索相关的各种技术和用法的详细讲解。 1.1、基本查询最基本的查询是使用 SELECT 语句来…...

编程日记 2025/8/3 21:55:49

220V转5V转12V电机驱动供电WT5105

220V转5V转12V电机驱动供电WT5105 WT5105 芯片概述 WT5105 是一款集成非隔离式电源控制器，内部集成了 650V 高雪崩能力功率 MOSFET 以及高压启动与自供电电路。该芯片具有多模式输出的特点，输出电压可通过 FB 电阻灵活调整，能够实现 3.3V 以…...

编程日记 2025/8/5 17:04:18

基于Python Django 的全国房价大数据可视化系统（附源码，部署）

博主介绍：✌程序员徐师兄，7年大厂开发经验。全网粉丝12w，CSDN博客专家，同时活跃在掘金、华为云、阿里云、InfoQ等平台，专注Java技术和毕业项目实战分享✌ 🍅文末获取源码联系🍅 👇&a…...

编程日记 2025/8/5 4:24:24

leetcode0113. 路径总和 II - medium

1 题目：路径总和 II 官方标定难度：中给你二叉树的根节点 root 和一个整数目标和 targetSum ，找出所有从根节点到叶子节点路径总和等于给定目标和的路径。叶子节点是指没有子节点的节点。示例 1： 输入：root …...

编程日记 2025/8/4 1:27:10

day46——两数之和-输入有序数组（LeetCode-167）

题目描述给你一个下标从 1 开始的整数数组 numbers ，该数组已按非递减顺序排列 ，请你从数组中找出满足相加之和等于目标数 target 的两个数。如果设这两个数分别是 numbers[index1] 和 numbers[index2] ，则 1 < index1 < index2 &l…...

编程日记 2025/8/10 3:49:23

数据结构：以一个例题演示弗洛伊德算法

例 8.5.2 利用弗洛伊德算法，对图 8.5.5 中左侧的带权有向图求最短路径，给出每一对顶点之间的最短路径及其路径长度在求解过程中的变化。图 8.5.5 带权图和邻接矩阵【解】根据图 8.5.5 中的带权有向图，可得所对应的邻接矩阵 g g g &#…...

编程日记 2025/8/9 21:24:53

Nginx 报错403 排查与解决

目录前言-环境基础问题出现：403 Forbidden问题排查问题解决前言今天领导让我部署一个前端项目,一顿操作报错访问报错403,让我们一起搞定他。环境 CentOS 7 x86 的服务器上部署了 Nginx 服务器。配置文件我把前端项目打包后的 dist 文件夹放在了 /root/…...

编程日记 2025/8/6 23:22:45

React-useImperativeHandle (forwardRef)

我们会遇到这样的场景：某个组件想要暴露一些方法，来供外部组件来调用。例如我们在开发form表单的时候，就需要把设置表单值、重置值、提交等方法暴露给外部使用。会有如下代码： import { forwardRef } from react;const Form for…...

编程日记 2025/8/7 7:11:03

研一自救指南 - 07. CSS面向面试学习

最近的前端面试多多少少都会遇到css的提问，感觉还是要把重点内容记记背背。这里基于b站和我自己面试的情况整理。 20250418更新： 1. BFC Block Formatting Context，一个块级的盒子，可以创建多个。里面有很多个块，他们…...

编程日记 2025/8/6 14:33:27

生成式人工智能驱动下的个性化学习资源开发研究——以K12学科知识图谱构建为例

一、引言 1.1 研究背景与意义在当今数字化时代，教育领域正经历着深刻的变革，生成式 AI 技术的迅猛发展为 K12 教育带来了新的契机与挑战。长期以来，K12 教育主要采用标准化教学模式，这种 “一刀切” 的方式难以满足学生多样化的…...

编程日记 2025/8/8 17:55:23

A股周度复盘与下周策略的deepseek提示词模板

以下是反向整理的股票大盘分析提示词模板，采用结构化框架数据占位符设计，可直接套用每周市场数据： 请根据一下markdown格式的模板，帮我检索整理并输出本周股市复盘和下周投资策略【A股周度复盘与下周策略提示词模板】一、市场…...

编程日记 2025/8/8 7:03:30

性能比拼: Deno vs. Node.js vs. Bun (2025版)

本内容是对知名性能评测博主 Anton Putra Deno vs. Node.js vs. Bun: Performance Comparison 2025 内容的翻译与整理, 有适当删减, 相关指标和结论以原作为准在本视频中，我们将使用当前可用的最新版本对 Node.js、Bun 和 Deno 进行比较。我决定更新本视频&#x…...

编程日记 2025/8/9 15:42:58

1. 泛型定义

2. 函数参数

3. 返回值函数

4. 重载（+2 overloads）

总结

示例

相关文章：