vue 实现数字滚动增加效果
参考:http://panjiachen.github.io/countTo/demo/
效果:
使用vue-countTo插件
安装:npm install vue-count-to
使用:
<template>
<countTo ref='example' :startVal='startVal' :endVal='endVal' :duration='2000'></countTo>
<div v-on:click="start()">点击开始</div>
</template>
<script>
import countTo from 'vue-count-to';
export default {
components: { countTo },
data () {
return {
// 初始值
startVal: 0,
// 最终值
endVal: 100
}
},
methods: {
start() {
this.$refs.example.start();
},
},
}