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

【Vue3-Typescript】<script setup lang=“ts“> 使用 ref标签 怎么获取 refs子组件呢

注意:请确保子组件已经正确挂载,并且通过 defineExpose 暴露了您想要在父组件中访问的属性或方法 

parent.vue

<template><child ref="childRef"></child><button @click="fun">点击父组件</button>
</template><script setup lang="ts">
import { ref } from "vue"
import child from "./child.vue"const childRef = ref(undefined as {childFun: () => void,childFunVue2: () => void
} | undefined)
const fun = () => {console.log("fun==",childRef.value)// console.log(childRef.value)// childRef.value?.childFunVue2()
}
</script>

child.vue 

<template><div><button>这里是子组件</button>
<!--		<slot name="child1"/>-->
<!--		<slot name="child2"/>--></div>
</template><script setup lang="ts">import {defineExpose} from "vue"const childFun = () => {console.log("这里是子组件的方法")
}const childFunVue2 = () => {console.log("这里是子组件的方法Vue2")
}defineExpose({childFun,childFunVue2
})</script>

相关文章:

【Vue3-Typescript】<script setup lang=“ts“> 使用 ref标签 怎么获取 refs子组件呢

注意&#xff1a;请确保子组件已经正确挂载&#xff0c;并且通过 defineExpose 暴露了您想要在父组件中访问的属性或方法 parent.vue <template><child ref"childRef"></child><button click"fun">点击父组件</button> &l…...

npm 超详细使用教程

文章目录 一、简介二、npm安装三、npm 的使用3.1 npm初始化项目3.2 安装包3.3 安装不同版本包3.4 避免系统权限3.5 更新包3.6 卸载包3.7 执行脚本3.8 pre- 和 post- 脚本3.9 npm link3.10 发布和卸载发布的包3.11 使用npm版本控制3.22 npm资源 四、总结 一、简介 npm&#xff…...

TypeScript函数

函数 函数:复用代码块 函数可以不写返回值 调用函数-----函数名() function a(){console.log(无参函数); } a();需要再函数后&#xff0c;写上返回值类型 没有返回值 使用void function e():string{return 可乐 } console.log(我得到了e()); function d():void{console.l…...

中海油某海上平台轨道巡检机器人解决方案

配电房作为能源传输和分配的核心枢纽&#xff0c;其安全运行直接影响到企业的生产稳定性和安全性。对于中海油这样的大型能源企业&#xff0c;配电房的运行状况至关重要。然而&#xff0c;传统的人工巡检方式存在效率低、作业风险高、巡检误差大等问题。为提升巡检效率、降低安…...

【NXP-MCXA153】SPI驱动移植

介绍 SPI总线由摩托罗拉公司开发&#xff0c;是一种全双工同步串行总线&#xff0c;由四个IO口组成&#xff1a;CS、SCLK、MISO、MOSI&#xff1b;通常用于CPU和外设之间进行通信&#xff0c;常见的SPI总线设备有&#xff1a;TFT LCD、QSPI FLASH、时钟模块、IMU等&#xff1b…...

Python if 编程题|Python一对一辅导教学

你好&#xff0c;我是悦创。 以下为 if 编程练习题&#xff1a; 1. 奇数乘积问题 题目描述: 编写一个程序&#xff0c;判断给定的两个整数是否都是奇数&#xff0c;如果是&#xff0c;返回它们的乘积&#xff1b;如果不是&#xff0c;返回它们的和。输入: num1, num2输出: n…...

机器学习——第十一章 特征选择与稀疏学习

11.1 子集搜索与评价 对一个学习任务来说&#xff0c;给定属性集&#xff0c;其中有些属性可能很关键、很有用&#xff0c;另一些属性则可能没什么用.我们将属性称为"特征" (feature) &#xff0c;对当前学习任务有用的属性称为"相关特征" (relevant featu…...

花式表演无人机技术详解

花式表演无人机作为现代科技与艺术融合的典范&#xff0c;以其独特的飞行姿态、绚烂的灯光效果及精准的控制能力&#xff0c;在各类庆典、体育赛事、音乐会等合中展现出非凡的魅力。本文将从以下几个方面对花式表演无人机技术进行详细解析。 1. 三维建模与编程 在花式表演无人…...

服务器那点事--防火墙

Linux服务器那点事--防火墙 Ⅰ、开启关闭Ⅱ、放开端口 Ⅰ、开启关闭 禁止防火墙开机自启systemctl disable firewalld 关闭防火墙systemctl stop firewalld 查看防火墙状态systemctl status firewalldⅡ、放开端口 例如&#xff1a;放开3306端口 设置放开3306端口 [rootbpm2…...

C:每日一题:单身狗

​​​​ 一、题目&#xff1a; 在一个整型数组中&#xff0c;只有一个数字出现一次&#xff0c;其他数组都是成对出现的&#xff0c;请找出那个只出现一次的数字。 整型数组 int arr[ ] {1,1,2,2,3,4,4} 二、思路分析&#xff1a; 1.&#xff0c;明确目标&#xff0c;选择…...

SQL之使用存储过程循环插入数据

1、已经创建了任务日志表 CREATE TABLE t_task_log (id bigint NOT NULL AUTO_INCREMENT,task_id bigint NOT NULL COMMENT 任务ID,read_time bigint NOT NULL COMMENT 单位秒&#xff0c;读取耗时,write_time bigint NOT NULL COMMENT 单位秒&#xff0c;写入耗时,read_size …...

智慧楼宇公厕系统小程序,提高卫生间管理使用效率

在当今的智慧楼宇中&#xff0c;公厕系统的管理和使用效率成为了衡量楼宇品质的重要指标之一。智慧楼宇公厕系统小程序的出现&#xff0c;为解决这一问题带来了全新的思路和方法。 一、检查公厕环境数据 智慧公厕系统不仅关注如厕的基本需求&#xff0c;还注重提升如厕环境的质…...

深度剖析:云数据库与传统数据库的显著差异

【若您对以下内容感兴趣&#xff0c;欢迎关注或联系我们】 在当今数字化时代&#xff0c;数据库技术不断演进&#xff0c;云数据库和传统数据库作为两种主要的数据库类型&#xff0c;在多个方面存在明显区别。下面我们将深入探讨这些差异。 一、部署方式 云数据库&#xff1…...

# 利刃出鞘_Tomcat 核心原理解析(六)

利刃出鞘_Tomcat 核心原理解析&#xff08;六&#xff09; 一、Tomcat专题 - 内容 1、Web 应用配置 2、Tomcat 管理配置 3、JVM 配置 4、Tomcat 集群 5、Tomcat 安全 6、Tomcat 性能调优 7、Tomcat 附加功能。 二、Tomcat专题 - Web应用配置介绍 1、Web.xml 配置文件…...

双亲委派模型

优质博文&#xff1a;IT-BLOG-CN 虚拟机设计团队把类加载阶段中的 “通过一个类的全限定名来获取描述此类的二进制字节流” 这个动作放到 Java虚拟机外部去实现&#xff0c;以便应用程序自己决定如何去获取所需要的类。实现这个动作的代码模块称为“类加载器”。 从Java虚拟机…...

Linux下ETCD安装、配置、命令

目录 1. ETCD简介 2. ETCD的安装 2.1 准备环境 2.2 下载ETCD 2.3 解压和移动文件 2.4 验证安装 3. ETCD的配置 3.1 基本配置 3.2 配置文件 3.3 集群配置 4. ETCD的常用命令 4.1 插入键值对 4.2 读取键值对 4.3 删除键值对 4.4 监视键的变化 4.5 列出所有键值 …...

【QT】静态库与动态库

文章目录 开始之前一、静态库(static Library)定义使用场景特点程序示例 二、动态库(dynamic Library)定义使用场景特点。程序示例第二种调用 开始之前 测试环境&#xff1a;Qt 5.15.2 Based on Qt 6.4.3(MSVC 2019, x86_64) 操作系统&#xff1a;Windows11 专业版 编程语言&am…...

R的行和列命名和类型的转换

下面内容摘录自&#xff1a; 4章8节&#xff1a;用R做数据重塑&#xff0c;行列命名和数据类型转换-CSDN博客 欢迎订阅我们专栏 一、行和列命名 在数据科学和统计分析中&#xff0c;命名是组织和管理数据的一个重要部分。尤其是在处理复杂的多维数据集时&#xff0c;为行和列命…...

某通用系统0day审计过程

前言 代码审计篇章都是自己跟几个师傅们一起审计的1day或者0day(当然都是小公司较为简单)&#xff0c;禁止未经允许进行转载&#xff0c;发布到博客的用意主要是想跟师傅们能够交流下审计的思路&#xff0c;毕竟审计的思路也是有说法的&#xff0c;或者是相互源码共享也OK&…...

windows C++-高级并发和异步(一)

并发和异步的由来已经很久了&#xff0c;对于从xp开始编程的人来说&#xff0c;这个概念并不陌生&#xff0c;但问题在于&#xff0c;在早期&#xff0c;这两个技术被认为是操作系统提供的服务&#xff0c;而非编程语言的概念。 事情发生变化的原因&#xff0c;和C标准不断变迁…...

IDEA 2018.2.3 下 Maven 依赖包消失?别慌,可能是版本兼容性在作祟

IDEA 2018.2.3 下 Maven 依赖包消失的深度排查指南 当你打开一个尘封已久的老项目&#xff0c;准备继续维护或迁移时&#xff0c;突然发现IDEA的External Libraries里空空如也&#xff0c;只剩下孤零零的JDK包&#xff0c;整个项目文件一片飘红——这种场景对许多维护历史代码库…...

保姆级教程:在CentOS 7/8服务器上部署DrissionPage爬虫(含Chrome无头模式配置)

CentOS服务器上DrissionPage爬虫的工业级部署指南 1. 环境准备与Chrome浏览器安装 在CentOS服务器上部署基于DrissionPage的爬虫系统&#xff0c;首要任务是构建稳定可靠的浏览器运行环境。与个人开发环境不同&#xff0c;生产服务器通常需要面对无图形界面、资源受限等特殊场景…...

ADXL335模拟传感器读数不稳?手把手教你用Arduino进行软件滤波与校准

ADXL335模拟传感器读数不稳&#xff1f;手把手教你用Arduino进行软件滤波与校准 当你把ADXL335加速度计接入Arduino&#xff0c;兴奋地跑起第一个测试程序时&#xff0c;那些跳动的数字可能很快会浇灭你的热情。原始读数像得了疟疾般颤抖&#xff0c;静止时本该稳定的1g重力加速…...

基于大语言模型的本地语义搜索工具LLocalSearch部署与应用指南

1. 项目概述&#xff1a;一个能“读懂”你电脑的本地搜索工具 如果你和我一样&#xff0c;电脑里塞满了各种文档、邮件、聊天记录和代码片段&#xff0c;那么“找东西”这件事&#xff0c;绝对能排进日常最耗时的任务前三。传统的文件搜索&#xff0c;比如Windows自带的搜索或者…...

OpenSpeedy终极指南:如何通过开源游戏加速工具突破帧率限制

OpenSpeedy终极指南&#xff1a;如何通过开源游戏加速工具突破帧率限制 【免费下载链接】OpenSpeedy &#x1f3ae; An open-source game speed modifier. 项目地址: https://gitcode.com/gh_mirrors/op/OpenSpeedy 你是否厌倦了游戏中的卡顿和帧率限制&#xff1f;Open…...

从零打造会“看”的电子眼:Teensy与OLED的嵌入式图形与传感器实践

1. 项目概述&#xff1a;打造一个会“看”的电子生命体几年前&#xff0c;我第一次在创客社区看到“Uncanny Eyes”项目时就被深深吸引了。一个微小的OLED屏幕&#xff0c;在代码驱动下&#xff0c;竟然能呈现出如此逼真、灵动的眼球运动&#xff0c;那种介于生命与机械之间的诡…...

基于RAG的智能知识库问答系统:从原理到部署实战

1. 项目概述&#xff1a;当AI大模型遇见知识库&#xff0c;一个开源的智能问答解决方案 最近在折腾一个很有意思的开源项目&#xff0c;叫 zhimaAi/chatwiki 。光看名字&#xff0c;你大概能猜到它的核心&#xff1a; chat 代表对话&#xff0c; wiki 代表知识库。没错&a…...

揭秘GPT超级提示工程:从原理到实战,打造高效AI协作指南

1. 项目概述&#xff1a;当“Awesome”遇见“Super Prompting”最近在GitHub上闲逛&#xff0c;发现了一个挺有意思的仓库&#xff0c;叫“CyberAlbSecOP/Awesome_GPT_Super_Prompting”。光看这名字&#xff0c;就透着一股“硬核”和“集大成”的味道。作为一个长期和各类大语…...

CircuitPython硬件交互实战:引脚命名、模块管理与内存优化

1. 项目概述&#xff1a;CircuitPython硬件交互的基石 如果你刚开始接触CircuitPython&#xff0c;或者从Arduino转过来&#xff0c;可能会对如何控制板子上的某个引脚感到困惑。板子上明明印着“A0”、“D13”&#xff0c;但在代码里到底该怎么写&#xff1f; board.A0 和 …...

AI控制协议标准(ACPS):构建智能体与工具交互的通用语言

1. 项目概述与核心价值最近在开源社区里&#xff0c;一个名为“AI-Control-Protocol-Standard”的项目引起了我的注意。这个由DaibinThink发起的项目&#xff0c;名字听起来就很有分量——“AI控制协议标准”。乍一看&#xff0c;你可能觉得这又是一个关于AI模型如何被调用的技…...