Vue之Animate

来源:互联网 发布:yii框架源码 编辑:程序博客网 时间:2024/05/29 06:56

Animate是一个基于CSS3的动画库,集成了很多实用的动画。

引入Animate

引入Animate的方式有多种:

1、CDN

cdn的话可以自己去网上找,我一般的是CDN。复制了link标签或者是url地址后,以link标签的形式插入到项目的入口html文件index.html

2、npm

npm安装

使用webpack的时候,可以用npm安装

npm install animate.css --save-dev

引入文件

我们在main.js文件中引入animate

import 'animate.css';

或者

require('animate.css/animate.min.css');

使用说明

1、版本问题

在使用animate的时候一定要注意使用的是哪个版本的,因为在不同版本中类名可能会有细微的差别。所以在参照别人的教程学习的时候要注意这个情况,比如vue官网使用的3.5.1的animate,类名是以slide-in-left的形式书写的,而我用的是3.5.2的,类名以slideInLeft的方式书写,导致我反复试验以为是自己弄错了原理之类的,最后查看animate源码的时候才发现是版本的差别。

三级标题

四级标题

注:

原创粉丝点击