Vue中添加过渡效果的方法

发布时间：2020-12-17 03:02:06 所属栏目：百科来源：网络整理

导读：关于vue的过渡效果，vue官方给的概述是这样的。 Vue 在插入、更新或者移除 DOM 时，提供多种不同方式的应用过渡效果。包括以下工具： 1、在 CSS 过渡和动画中自动应用 class 2、可以配合使用第三方 CSS 动画库，如 Animate.css 3、在过渡钩子函数中使用 Jav

关于vue的过渡效果，vue官方给的概述是这样的。

Vue 在插入、更新或者移除 DOM 时，提供多种不同方式的应用过渡效果。

包括以下工具：

1、在 CSS 过渡和动画中自动应用 class

2、可以配合使用第三方 CSS 动画库，如 Animate.css

3、在过渡钩子函数中使用 JavaScript 直接操作 DOM

4、可以配合使用第三方 JavaScript 动画库，如 Velocity.js

其中里面也给出了许多的例子，但是例子给到了“多个元素过渡”的时候，就没有案例的代码了，在这里对vue官方文档的这部分案例做一部分补充。

以下我的代码

过渡效果-多个元素的过渡