高级vue 模板中 ref 的使用用法

  1. ref + 普通dom标签  获取真实dom对象
  2. ref + 组件标签  获取组件实例对象
 
<template>
    <h1 ref="h1Ref">www.96net.com.cn</h1>
    <ref-comoonent ref="comRef"></ref-comoonent>
  </template>
 
  <script>
  import { onMounted, ref } from 'vue'
  export default {

    setup() {
      const h1Ref = ref(null)
      const comRef = ref(null)
      onMounted(() => {
        console.log(h1Ref.value)
        console.log(comRef.value)
      })
      // 必须return
      return {
        h1Ref,
        comRef
      }
    }
  }
  </script>
posted @ 2022-10-05 20:26  学无边涯  阅读(45)  评论(0编辑  收藏  举报