vue如何获取一个元素的基本信息
PS:代码全部使用Vue3和setup语法糖来写的
首先准备
HTML结构
<template>
<div class="main" ref="myElement"></div>
<t-button @click="onClick"> 点击该元素的相关信息获取 </t-button>
</template>
Vue部分
<script setup>
import { onMounted, ref } from "vue";
const myElement = ref(null);
const onClick = () => {
console.log('myElement.value.clientWidth='+ myElement.value.clientWidth);
console.log(myElement);
};
</script>
注意!!!
这里,我们在实验的时候
假如说我们打印是一个myElement.value的形式,我们可以把该元素的DOM结构打印在我们的控制台上,但是我们想查看这元素的基本信息的时候,这里只需要打印这个定义的变量就好,这样一边看一遍获取自己想要的一些信息。