当前位置: 首页 > 网络应用技术

VUE监视DOM元素大小的变化

时间:2023-03-05 22:55:39 网络应用技术

  作为标题,第一个反应:

  简单而粗鲁,但缺点也很明显:文档视图已在大时的大小上调整为调整大小事件,只有窗口,而普通的dom元素则没有变化。

  因此,一般的DOM元素监视大小的变化,以及放弃错误的第一种感觉,您可以选择以下方法:

  属于Web API

  可以听到的边界框架或边界框架更改-mdn resizeObserver

  通过构造函数函数,创建并返回resizeObserver对象,然后:

  您什么时候触发了执行回调的?

  ResizeObserver中有某些浏览器兼容性问题,请参阅我可以使用详细信息

  NPM软件包的定位是:

  调整大小观察者API的多填充。

  基于突变播放或突变事件:为了解决resizeObserver API的浏览器兼容性问题

  (请注意:IE10和较低版本中的样式)

  元素UI和隐藏组件:

  与调整尺寸的观察者 - polyfill相同,它也是一个可以监视DOM元素大小的NPM软件包。

  定位是:

  优化的跨浏览器调整元素的Listner。

  性能得到了改善,使用情况类似于ResizeObserver API

  如上所述,或多或少需要记住一些语法

  问:为什么它不能成为VUE的自定义指令?

  答:主角通常使用Vue-Resize-Observer出现

  注意:vue 3.x已得到支持

  安装,入口文件中的参考:

  它何时触发处理程序?

  如何更改听证容器大大变化

  如果有问题,请告知?