(1)通过npm安装:
npm install wowjs --save-dev
animate.css会自动安装。
(2)在main.js中引入animate.css
import ‘animate.css‘
在组件需要的地方引入wowjs
有两种使用方式:
1. import {WOW} from ‘wowjs‘ mounted() { new WOW().init() }
2.import WOW from ‘wowjs‘ mounted() { new WOW.WOW().init() }
下面给出在实例中的应用:
<template>
?<div class="caselist">
???<ul class="clearfix">
?????<li class="wow slideInUp" v-for="(item, index) in cases" :key="index">
?????</li>
???</ul>
?</div>
</template>
<script type="text/ecmascript-6">
?import {WOW} from ‘wowjs‘
?export default {
???props: [‘cases‘],
???watch: {
?????cases() {
???????this.$nextTick(() => { // 在dom渲染完后,再执行动画
?????????var wow = new WOW({
???????????live: false
?????????})
?????????wow.init()
???????})
?????}
???}
?}
</script>
---------------------
作者:yumihe
来源:CSDN
原文:https://blog.csdn.net/qq_32678401/article/details/82016802
版权声明:本文为博主原创文章,转载请附上博文链接!
vue中wowjs的使用
原文地址:https://www.cnblogs.com/shaozhu520/p/10129845.html