vue 数字滚动插件vue-countTo

安装

npm install vue-count-to

使用

<template>
  <countTo :startVal='startVal' :endVal='endVal' :duration='3000' ref='count1'></countTo>
</template>

<script>
  import countTo from 'vue-count-to';
  export default {
    components: { countTo },
    data () {
      return {
        startVal: 0,
        endVal: 2017
      }
    }
  }
</script>

若是想监听变化的某一段值 开始值的变化，可以用watch监听

watch: {
        endVal: {
            handler(val, oldVal) {
                this.startVal= oldVal;
            },
            deep: true
        }
    },

选项

** 注意：当autoplay：true时，它将在startVal或endVal更改时自动启动**

功能

开始计数

this.$refs.count1.start()  //其他一样

本文参考 vue-countTo—简单好用的一个数字滚动插件.