Vue3 ref获取dom对象

66 阅读1分钟

ref获取dom对象

ref不仅可以渲染修改后的数据,同时也可以获取dom元素。 image.png 注意在代码中div的ref的属性值要写Ts代码中变量名保持一致才可以!!

<template>
  <div ref="dom">
    我是Dom
  </div>
  <hr>
  <button @click="tap">点击</button>
</template>

<script setup lang="ts">
import {ref} from "vue";
const dom = ref<HTMLDivElement>()
const tap = () => {
  console.log(dom.value?.innerText)
}
</script>

<style scoped>

</style>
```
```