vue3模板引用ref

• 什么是模板引用？

        我理解的就是获取dom对象，例如vue2中验证表单规则会用到this.$ref.ref名.validate()

• 怎么用？

        1.引用普通节点

<script setup>
 //首先引入ref 
import {ref} from 'vue'
//创建一个引用
const h1ref=ref(null)

</script>

<template>
<h1 ref='h1ref'>哈哈</h1>
</template>

        2.拿到引用的普通节点

！！这有一个重点！！获取模板引用的时机是组件挂载完毕

onMounted(()=>{
    console.log(h1ref)//<h1>哈哈</h1>
})

        3.父组件引用子组件时不会获取到子组件内部的属性和方法，可以通过defineExpose编译宏指定哪些属性和方法允许访问

//一个子组件
<script setup>
import {ref} from 'vue'
const emit = defineEmits(["sendMessage"]);
const name = ref('Ann')
//这样，当父组件引用此组件时，内部的name和send便都可以被获取到了
defineExpose({name,send})
</script>