初学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>
相关推荐
名字还没想好☜几秒前
React useImperativeHandle 实战:让父组件安全地调用子组件的方法
前端·javascript·react.js·react·forwardref
CodeSheep2 分钟前
FFmpeg 9.0正式发布:代号“Lei”,以纪念中国开发者雷霄骅
前端·后端·程序员
IT_陈寒3 分钟前
小心!Java里的这个空指针问题绝对坑过你
前端·人工智能·后端
Canace5 分钟前
AI 都能操作浏览器了,却读不了微信公众号文章
前端·人工智能·产品
铁皮饭盒7 分钟前
阿里ASR语音转文字,用JS模拟微信
前端·javascript·后端
小比特-combat19 分钟前
FreeRTOS任务通知
java·服务器·前端
柒@宝儿姐21 分钟前
若依 B 端从浏览器访问升级为 Windows 安装包交付流程
前端·javascript·vue.js·windows
程序员黑豆5 小时前
鸿蒙应用开发:V1与V2版本数据持久化实战教程
前端·harmonyos
小月土星8 小时前
React Router 前端路由深度解析:从传统后端路由到现代 SPA 的完整演进
前端