获取图片的offsetHeight时图片还没有加载完怎么办?
场景是一个瀑布流的容器,每个图片item的高度由里面的内容和图片撑开,不定高。我需要高度来决定下一个图片放在瀑布流的哪一个列上,所以我通过offsetHeight来获取每个item的高度。我对图片进行了预加载(new Image() 随后Image.onload会返回一个Promise),所有返回的Promise放到一个数组里,通过Promise.all进行触发,在Promise.all.then中我打印了item.offsetHeight同时上面的所有操作都放在了nextTick里。最后的结果是,offsetHeight不总能获得正确的结果,很多次都是部分的高度,比如item最终的高度是435,但此时获得的只是280.我设置了一个50ms的定时器,此时打印的offsetHeight已经可以正常获得了,所以我在nextTick中得到的高度是正在渲染的部分图片的高度?但我明明有了图片的预加载+nextTick,为什么他们没有在图片完全渲染完执行呢?求助各位大佬,想了一下午+晚上了,没有解决,我该怎么办呢?总不能设置一个几十ms的定时器吧?我现在只有10张图片,后面50 100,可怎么办呀o(╥﹏╥)o
回复
1个回答

test
2024-07-13
图片是后端返回的,可以让后端顺便返回图片的尺寸,这个不难做到
回复

适合作为回答的
- 经过验证的有效解决办法
- 自己的经验指引,对解决问题有帮助
- 遵循 Markdown 语法排版,代码语义正确
不该作为回答的
- 询问内容细节或回复楼层
- 与题目无关的内容
- “赞”“顶”“同问”“看手册”“解决了没”等毫无意义的内容