ref的作用：

（1）第一个作用：和vue一样：

• 绑在dom节点上拿到的是dom节点；
• 绑在组件上拿到的是组件对象；

定义方式：

<template>
    <div>
        <input type="text" ref="mytextref">
        <button @click="handleClick()">change</button>
    </div>
</template>

<script>
import { ref } from '@vue/reactivity'
export default {
    setup(){
        const handleClick=()=>{
            console.log(mytextref.value)//必须“.value”才能拿到input标签
        }

        // 创建ref对象
        const mytextref =ref()
        return {
            handleClick,
            mytextref
        }
    }
}
</script>

重点强调：

<input type="text" ref="myte