Vue中基于class和style的过渡和动画
2021-08-04 本文已影响0人
深度剖析JavaScript
可以通过添加一个条件class
来激活动画,style
也是类似,本质上v-bind
动态绑定
为了更好的性能,一方面我们可以使用不触发重绘的属性,如Transform
和Opacity
;另外一方面可以对动画进行硬件加速,如通过perspective
、backface-visibility
和 transform:translateZ(x)
等来触发硬件加速
为了方便我将相关内容简记如下图:
2基于class和style的过渡和动画.png更多相关原图和原始文件已上传GitHub
,一来方便批量下载相关脑图,二来可以方便你按照自己的的思路进行修改!
GitHub地址:https://github.com/jCodeLife/mind-map
文中如有其他问题,欢迎留言告知~