vue3中通过ref()获取到元素

<template>
<!-- 通过ref()获取到元素 -->
    <p ref="myRef">这是p标签</p>
</template>

<script lang='ts'>
import { defineComponent,ref,onMounted,nextTick } from 'vue'
export default defineComponent({
  setup () {
    let myRef = ref(); // 获取绑定了ref属性，且值为myRef的标签，myRef 一定和标签中的myRef名称要一致
   
    console.log("setup:",myRef.value);  // undefined,这里还没获取到，时机不对，写在onMounted中or nextTick中  
    
    // onMounted(()=>{
    //   console.log("onMounted:",myRef.value);  // 挂载完毕之后，才能获取到元素
    // })
    nextTick(()=>{
      console.log("nextTick:",myRef.value);  // 在下一个dom更新的时候执行（只会调用1次）
    })
    
    return {
      myRef
  
    }
  }
})
</script>