vue3+ts获取定位

在Vue 3和TypeScript中获取元素的位置，可以使用原生DOM API结合Vue的ref来实现。以下是一个简单的例子：

1. 在模板中，为需要获取位置信息的元素添加ref属性。
2. 在setup函数中，使用ref和Vue的onMounted生命周期钩子来获取元素的位置。

<template>
  <div ref="elementRef">获取位置信息的元素</div>
</template>
 
<script lang="ts">
import { ref, onMounted } from 'vue';
 
export default {
  setup() {
    const elementRef = ref<HTMLElement | null>(null);
 
    onMounted(() => {
      if (elementRef.value) {
        const rect = elementRef.value.getBoundingClientRect();
        console.log('元素的位置:', rect);
      }
    });
 
    return {
      elementRef
    };
  }
};
</script>

在这个例子中，elementRef是一个ref，它被绑定到模板中的div元素上。在onMounted钩子中，通过访问elementRef.value.getBoundingClientRect()获取元素的位置信息，并在控制台中打印出来。这样就可以在Vue组件被挂载后获取到元素的位置。