初学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>
相关推荐
IT_陈寒23 分钟前
Vue的computed属性竟然坑了我一把
前端·人工智能·后端
威斯软科的老司机29 分钟前
通俗讲解 CNN 图像识别、向量 Embedding、Softmax 概率计算这三块的简化原理
前端·人工智能·ui·数字孪生
2601_962382431 小时前
剑指大前端全栈工程师(全2册)主要情节
javascript·实战案例·全栈工程师·剑指大前端·html5+css3
泯泷1 小时前
手搓JSVM第 12 篇:完整最小 JSVM 实现与源码设计复盘
前端·javascript·前端框架
默_笙2 小时前
🍔 给 AI 发一张结构化表格(下):从"自由发挥"到"按格填空"的输出驯服指南
前端·javascript
泯泷2 小时前
手搓JSVM第 11 篇:打包、模块与 CLI:把 VM 产物变成可运行文件
前端·javascript·前端框架
泯泷2 小时前
手搓JSVM第 10 篇:对象、数组与属性访问
前端·javascript·前端框架
泯泷2 小时前
手搓JSVM第 9 篇:闭包:函数如何记住外部变量
前端·javascript·前端框架
晴天162 小时前
前端 SSR、BFF 原理介绍
前端·javascript·网络·html
边境悍匪3 小时前
蜗牛学苑 Java 智能体学习 Day40|Vue 工程化与 ElementPlus 思维导图复盘
java·vue.js·学习