美文网首页
vue获取元素宽、高、距离左边距离,右,上距离等还有XY坐标轴

vue获取元素宽、高、距离左边距离,右,上距离等还有XY坐标轴

作者: world_7735 | 来源:发表于2020-07-08 15:30 被阅读0次

1.示例组件结构

<template>
  <div ref="myBox">
    <v-page :ref="myPage">
    </v-page>
  </div>
</template>

2.获取距离顶部的距离

// ref=myBox元素
this.$refs.myBox.getBoundingClientRect().top
// ref=myPage组件
this.$refs.myPage.$el.getBoundingClientRect().top

3.获取高度

// ref=myBox元素
this.$refs.myBox.offsetHeight
// ref=myPage组件
this.$refs.myPage.$el.offsetHeight

4. 获取宽度

// ref=myBox元素
this.$refs.myBox.offsetWidth
// ref=myPage组件
this.$refs.myPage.$el.offsetWidth

相关文章

网友评论

      本文标题:vue获取元素宽、高、距离左边距离,右,上距离等还有XY坐标轴

      本文链接:https://www.haomeiwen.com/subject/tksccktx.html