有时候我们模板引用，但是在使用的时候，ts提示却不行，没有提示组件通过defineExpose暴露的方法名称，虽然这不是很影响，但是可以解决还是可以解决下~
<!-- MyModal.vue -->
<script setup lang="ts">
import { ref } from 'vue'
const sayHello = () => (console.log('我会说hello'))
defineExpose({
sayHello
})
</script>然后我们在父级使用，输入完成MyModalRef.value会发现没有sayHello这个函数提示，所以这个时候我们就需要使用InstanceType 工具类型来获取其实例类型
<!-- App.vue -->
<script setup lang="ts">
import MyModal from './MyModal.vue'
const MyModalRef = ref()
const handleOperation = () => {
MyModalRef.value.sayHello
}
</script>
使用InstanceType 工具类型获取其实例类型：
<!-- MyModal.vue -->
<script setup lang="ts">
import { ref } from 'vue'
const sayHello = () => (console.log('我会说hello'))
defineExpose({
open
})
</script>父级使用
<!-- App.vue -->
<script setup lang="ts">
import MyModal from './MyModal.vue'
const MyModalRef = ref<InstanceType<typeof MyModal> | null>(null)
const handleOperation = () => {
MyModalRef.value?.sayHello()
}
</script>貌似依旧没有提示使用InstanceType在提示的时候，然后输入错误内容也没有在编译前进行报错…，不过vue官方这样子说了，那就听他的吧(其实我一般不用，不过也学到了)
@vue官方API为组件模板引用标注类型
Vue3和TS绝对是在今年最受欢迎的前端技术之列。许多公司正在使用 Vue3 + TS + Vite 组合来开发新项目。以下是重写后的句子：分享在Vue3组件中如何使用Composition-Api结合TS类型。
使用
