Vue封装的过渡与动画： 在插入、更新或移除DOM元素时，在合适的时候给元素添加样式类名。

写法：

1. 准备好样式：
   • 元素进入的样式：
     1. v-enter：进入的起点
     2. v-enter-active：进入过程中
     3. v-enter-to：进入的终点
   • 元素离开的样式：
     1. v-leave：离开的起点
     2. v-leave-active：离开过程中
     3. v-leave-to：离开的终点
2. 使用====包裹要过度的元素，并配置name属性，此时需要将上面样式名为 v 换为 name
3. 要让页面一开始就显示动画，需要添加appear

  
你好啊！


 
4.备注: 若有多个元素需要过渡，则需要使用 ,且每个元素都要指定 key值
 

  
你好啊！
  
尚硅谷！


 
5.第三方动画库 Animate.css 网站:https://www.npmjs.com/package/animate.css
 
安装完成后，直接引用样式 import ‘animate.css’
 

  
你好啊！
  
尚硅谷！

 
src/App.vue
 



 
src/components/test.vue
 





 
src/components/test2
 






 
src/components/test3