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

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

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

在这里插入图片描述
在这里插入图片描述
注意:transition 如果不写默认是index.vue 所以要注意这一点

在这里插入图片描述

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

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

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

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

  • 1
    点赞
  • 5
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值