1、安装依赖
npm install wowjs -S
2、main.js中引入
引入animate.css,安装wowjs之后,直接引入
import 'animate.css'
3、在需要使用wowjs的组件中使用
在标签上添加动画的类名
data-wow-duration:动画持续时间;data-wow-delay:动画延迟时间。更多属性参考官网文档:https://www.delac.io/wow/docs.html
<p style="font-size:30px" class="wow slideInRight" data-wow-duration ="1s" data-wow-delay ="5s">头部</p>
<script>
import {WOW} from 'wowjs'
export default {
data() {
return {
};
},
mounted() {
// 在项目加载完成之后初始化wow
this.$nextTick(() => {
let wow = new WOW({
live:false
})
wow.init()
})
},
methods: {
}
};
</script>