文章目录
- 一、vue中的列表动画如何实现
- 列表动画原理:
- 二、vue中如何封装动画
- 第1个版本：css动画版
- 第2个版本： js动画版（推荐）
一、vue中的列表动画如何实现
举个例子:
列表动画原理:
二、vue中如何封装动画
先看之前的动画是如何实现的:
那么如何实现自己封装vue动画呢?
思路就是：我们自己定义一个组件，然后需要动画的地方，我们直接引用我们自定义的组件即可。
第1个版本：css动画版
这版本，属于半封装，也就是css样式不在封装内。
如何使用呢?
第2个版本： js动画版（推荐）
这里不使用vue的动画css样式了，使用vue的js动画钩子封装进组件。
这样即可使用封装的动画。
开通了个微信公众号：
搜索： 怒放de每一天
后续可能不定时推送相关文章，期待和大家一起成长！！
完
