vue监听div的高度变化

最新推荐文章于 2025-07-24 19:41:55 发布

原创最新推荐文章于 2025-07-24 19:41:55 发布 · 2.5k 阅读

4 ·

本内容遵循CC 4.0 BY-SA版权协议

标签

#css #css3 #html

收录于

这篇博客介绍了如何在Vue应用中利用element-resize-detector库监听DOM元素的尺寸变化。在组件的mounted生命周期钩子中，实例化elementResizeDetectorMaker，并将其应用于指定的id为'aa'的元素。当元素尺寸发生变化时，内部的回调函数会在$nextTick中执行，适合处理响应式更新的业务逻辑。

npm install element-resize-detector --save



import elementResizeDetectorMaker from "element-resize-detector";



mounted() {
    const _this = this;
    const erd = elementResizeDetectorMaker();
    erd.listenTo(document.getElementById("aa"), element => {
      _this.$nextTick(() => {
        //监听到事件后执行的业务逻辑
      });
    });
  },