• 组件上的 ref，组合式写法的变化；

• 在 2024.09.03 发布的 v3.5.0 版上新增接口 useTemplateRef；

v3.5 之前

• 代码第 8 行，导入 ref；
• 代码第 10 行，使用 ref 传参为 null，变量名与 第三行 ref 同名；

<template><div><span ref="spanRef">这是一条测试！！！</span>        <button @click="onClick">点击</button></div>
</template>
<script setup>
import { ref } from 'vue'const spanRef = ref(null)function onClick() {console.log(spanRef.value.innerText)
}
</script>

v3.5 以后

• 代码第 8 行，导入接口 useTemplateRef；
• 代码第 10 行，使用 useTemplateRef 传参为字符串 spanRef，传参与 第三行 ref 同名；

<template><div><span ref="spanRef">这是一条测试！！！</span>        <button @click="onClick">点击</button></div>
</template>
<script setup>
import { useTemplateRef } from 'vue'const spanObj = useTemplateRef('spanRef')function onClick() {console.log(spanObj.value.innerText)
}
</script>