vue 实时获取元素高度

马娟

已于 2023-10-27 16:12:36 修改

阅读量539

点赞数

文章标签： vue.js 前端 javascript

于 2023-08-18 16:32:18 首次发布

本文链接：https://blog.youkuaiyun.com/weixin_41077029/article/details/132364615

版权

本文介绍了如何在Vue项目中安装并使用element-resize-detector库，通过`ref`和`onMounted`钩子实现对指定DOM元素的滚动高度监听，当元素大小变化时更新scrollHeight值。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

1.安装element-resize-detector

npm install --save element-resize-detector

2.引入

<script>
    import { ref,onMounted,} from 'vue';
    import elementResizeDetector from "element-resize-detector";
    const scrollHeight = ref('100%')
     onMounted(() => {
          var erd = elementResizeDetector();
          erd.listenTo("监听的dom元素", (element) => {
            scrollHeight.value = element.offsetHeight-102
          })
    })
</script>