初学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>
相关推荐
sugar__salt12 小时前
前端路由技术详解:从传统多页到 React SPA 的完整进化之路
前端·javascript·react.js·前端框架
Canace12 小时前
Harness Engineering 到底在做什么
前端·人工智能·ai编程
用户842981424181012 小时前
JS代码压缩实测:可减小体积、提高执行效率!
前端·javascript·后端
snow@li12 小时前
Vue Axios封装与SpringBoot Payload封装全景关联分析(前后端数据交互底层闭环)
前端·vue.js·spring boot
Csvn12 小时前
🐛 React StrictMode 下 useEffect 执行两次:不是 Bug,是特性
前端
用户831348593069813 小时前
Vue3+Cesium实现阴天乌云+下雨天气特效
vue.js·webgl·cesium
做好一个小前端13 小时前
ECharts 折线图大数据量性能优化参考
前端·性能优化·echarts
渣波13 小时前
🧭 从 URL 到组件:深度剖析 React Router 原理与 SPA 路由架构艺术
前端
用户8524950718413 小时前
一个 useRef,三种人生:从 DOM 引用到 Web Worker
前端
无人生还13 小时前
从 Vue3 到 React · 快速上手系列第 13 篇:工程化与综合实战(Vite + Todo 应用)
前端·vue.js·react.js