组件引用（在脚本里拿到组件实例/DOM）适合：聚焦输入框、调用组件暴露的方法（defineExpose）、获取 DOM。

适合：聚焦输入框、调用组件暴露的方法（defineExpose）、获取 DOM。

DOM 引用：

<script setup lang="ts">
import { onMounted, ref } from 'vue'

const inputEl = ref<HTMLInputElement | null>(null)

onMounted(() => {
  inputEl.value?.focus()
})
</script>

<template>
  <input ref="inputEl" />
</template>

子组件实例引用（调用子组件方法）：

<script setup lang="ts">
import { ref } from 'vue'
import MyDialog from './MyDialog.vue'

const dialogRef = ref<InstanceType<typeof MyDialog> | null>(null)

function open() {
  dialogRef.value?.open()
}
</script>

<template>
  <MyDialog ref="dialogRef" />
  <button @click="open">打开</button>
</template>