vue中(动画)第三方插件库的使用

首先安装模块
npm install animate.css 命令

考虑到我们会在多个路组件中使用 我这里直接引入到main.js 里面

vue中(动画)第三方插件库的使用_第1张图片
在这里插入图片描述
注意:transition 如果不写默认是index.vue 所以要注意这一点

vue中(动画)第三方插件库的使用_第2张图片

a. 我们使用第三方库 直接用transition 标签 里面加上两个过渡类名
b. 后面直接加过渡动画名字 后面再跟上 animated 就可以了
c. 不需要在下面在写 动画效果了 如果需要改过渡动画 可以去我们安装的插件里面找到那个animate.css 修改需要的即可

总结:
第三方动画库的使用

  1. 下载安装引入 animate.css
  2. 在目标元素外部添加 过度标签
  3. enter-active-class leave-active-class 进入离开使用的动画

欢迎各位大佬留下脚印 你的脚印就是我的动力 。晚安!

你可能感兴趣的:(vue中(动画)第三方插件库的使用)