数字滚动的动画
这里做一个查阅资料的笔记,呈现方式直接代码
1.plugins文件夹下面建立vue-count-to.js
import Vue from 'vue'
import countTo from 'vue-count-to'
Vue.component('countTo', countTo)
2.nuxt.config.js配置
css: ['animate.css/animate.css'], //这里使用的wowjs库里面的css,如果需要animate官方的动画,可自行下载、配置
plugins: [
{ src: "@/plugins/vue-count-to.js", ssr: false }
],
3.使用(可以再layout文件或者其他文件单独按需引入)
<countTo
:startVal="0"
:endVal="100"
:duration="2000"
:suffix="'$'"
/>