初学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>
相关推荐
Jlzn8888几秒前
华南PACK线自动化率怎么统计才靠谱
前端·javascript·自动化
Hilaku22 分钟前
ERP选型时不问MCP,等于默认三年后再付一次集成费!
前端·javascript·程序员
程序人生88822 分钟前
几百张固定位置扫描件如何离线批量清?DocConverter Web 批量去水印链路
前端
deli00723 分钟前
一个汉字三种编码:UTF-8、GBK、UTF-16 逐字节对比实测
前端
庖丁解牛33 分钟前
第二课:把代码保存成网页 + 认识变量 (2)
前端
代码猎人33 分钟前
怎么开发一个Vue3项目
前端
梦里寻码33 分钟前
从 0 到 1 用 NestJS + LangChain 搭一套可售卖的 SaaS AI 客服:挂件一行代码接入,知识库秒变 SEO 帮助中心
前端·后端·github
爱喝水的小周34 分钟前
实验十一 Vuex 实现王者荣耀后台比赛管理系统
前端·css·html
三十而立洋35 分钟前
前端模块化的演进:从全局变量到 Import Maps
前端·javascript·前端工程化
橘猫走江湖36 分钟前
浮动塌陷复现失败:父元素为什么一直不塌
前端·css