vue3 中使用ref获取组件元素

// 父组件
<template>
    <Son ref="sonRef" />
  </div>
</template>
<script lang='ts' setup>
import { ref } from "vue";
import Son from "../components/son.vue"

const sonRef = ref<InstanceType<typeof Son>>()

const changeSon = () => {
  console.log(sonRef.value!.test);
  sonRef.value!.hander()
}
</script>

// 子组件
<script setup lang='ts'>
import { defineExpose } from "vue"
const test = "Son"
const hander = () => {
  console.log(123);

}
// 向外暴露属性属性与方法
defineExpose({ hander, test })
</script>