初学vue3与ts:获取组件ref实例

typescript 复制代码
/**
 * 获取组件ref
 * @param {VueComponentIns} 组件实例
 * @returns 组件ref
 */
// eslint-disable-next-line
export function useCompRef<T extends abstract new (...args: any) => any>(_: T) {
	return ref<InstanceType<T>>();
}

使用

html 复制代码
<a-com ref="aComRef"></a-com>
<script lang="ts" setup>
import ACom from '@/components/a-com.vue';
//引入
import { useCompRef } from '@/sss/useRefs';
const aComRef = useCompRef(ACom);
//调用组件里的函数,比如说这个组件是一个弹窗,那么打开弹窗
const openCom = () => {
	aComRef.value?.open();
};
</script>
相关推荐
之歆2 小时前
Day03_HTML 列表、表格、表单完整指南(下)
android·javascript·html
焦糖玛奇朵婷2 小时前
解锁扭蛋机小程序的五大优势
java·大数据·服务器·前端·小程序
SwJieJie2 小时前
windsurf的配置和项目规则、工作流、agent技巧使用
前端
白日梦想家6812 小时前
从基础入手,分清一次性定时器与永久定时器
前端
李白的天不白2 小时前
读到数据为undefind是的几种情况
开发语言·javascript·ecmascript
AIwork4me2 小时前
别再把 RAG 当知识库:用 AutoClaw 搭一套会进化的 Karpathy LLM Wiki
前端
彩票管理中心秘书长2 小时前
Git 归档与补丁命令大全(完整详解版)
前端
RePeaT3 小时前
【Nginx】前端项目部署与反向代理实战指南
前端·nginx
一 乐3 小时前
交通感知与车路协同系统|基于springboot + vue交通感知与车路协同系统(源码+数据库+文档)
java·数据库·vue.js·spring boot·论文·毕设·交通感知与车路协同系统
索木木4 小时前
ShortCut MoE模型分析
前端·html