vue transition 强制重绘

Question

vue transition 高度height 0 到 auto的过渡效果
我看到有人在钩子中使用了强制重绘，为什么要这样做？

https://codepen.io/squirmy/pe...

Answer 1

参考下这里的答案，原因是一样的

Answer 2

浏览器为了优化性能基本都是异步重排，即周期性地计算脏值。而获取某些值会触发同步重排，因为浏览器必须马上计算一遍，将异步累积的队列清空，才能得出准确值。

所以这个代码是为了让第一次设的高度马上应用，然后对第二遍的过渡。

它这里其实发生了两遍同步重排 getComputedStyle(el).height 也会触发一遍。