Vue3 Ts 如何获取组件的类型
vue3 Ts ref 子组件
1、默认写法
typeof:获取ts类型
InstanceType:获取模版的实例
<tempolate>
<myComponent ref="myCompRef">
</tempolate>
<script setup lang="ts">
import { ref } from "vue"
import myComponent "@/compoments/myComponent"
const myCompRef = ref<InstanceType<typeof myComponent>>()
</script>
2、封装后
abstract:定义抽象类
”_“:命名规范,参数名前添加下划线,表示该参数本身是不使用的,取消参数没有使用的警告
import { ref } from "vue"
export function useCompRef<T extends abstract new (...args: any) => any> (_comp: T){
return ref<InstanceType<T>>()
}
<tempolate>
<myComponent ref="myCompRef">
</tempolate>
<script setup lang="ts">
import { useCompRef } from "@/utils/useCompRef"
import myComponent "@/compoments/myComponent"
const myCompRef = useCompRef(myComponent)
</script>