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();

    },

},

  }

猜你喜欢

转载自blog.csdn.net/u012011360/article/details/103120045