今天在写一个组件的时候突然发现使用offsetHeight获取元素的高度总是不对，经过检查发现是缺少了元素中img的高度，这是为什么呢?
这是因为图片加载需要时间，代码在获取div的offsetHeight的时候，图片还没有加载完成，所以得到的高度没有包含图片。
解决办法有两个：
1.在原生JS中将代码放在window.onload中
2.给img标签加上height属性
由于我是在写瀑布流组件，所以不能写图片的高度，所以使用第一个方法解决。
在vue中将要执行的代码放在mounted函数中来让其在模板渲染成html后调用代码
但是很可惜还是没能成功，最后找到了一个方法：
在img标签内添加自定义事件 @onload="imgload"
在methods里添加imgload函数,将要执行的代码放入.意思是等到图片加载完成后调用
问题解决
中间百度到用nextTick和定时器的方法,但是我并没有成功,也许是没找对方法,待后面再有机会研究的时候再试试
今天在写一个组件的时候突然发现使用offsetHeight获取元素的高度总是不对，经过检查发现是缺少了元素中img...
offset 元素.offsetHeight获取元素的客观高度，返回值为数值没有单位，它获取到的包括:元素内容高度...
offset offsetWidth offsetHeight offsetWidth 元素控件自身的宽度。不包括...
offsetWidth//返回元素的宽度（包括元素宽度、内边距和边框，不包括外边距） offsetHeight//...
offsetWidth： 返回元素的宽度（包括元素宽度、内边距和边框，不包括外边距） offsetHeight： ...
offsetWidth //返回元素的宽度（包括元素宽度、内边距和边框，不包括外边距） offsetHeight ...
//获取高度值var height= this.$refs.text.offsetHeight; //100 //...
offsetHeight 常用，得到的是元素 border + padding + height 的高度 scro...
获取循环的每一个： 获取img 的路径： 修改图片路径： 判断元素存在不存在： 获取元素的值，如果计算用parse...
本文标题：vue中获取元素offsetHeight不包括IMG图片高度的解
本文链接：https://www.haomeiwen.com/subject/dsyyvhtx.html
网友评论