Countup.js：vue-countup-v2（npm）數字滾動插件

1、官方地址：http://inorganik.github.io/countUp.js/

2、官方demo：

3、參數說明：

params——start（開始數字）、end（結束數字）、decimals（小數位數）、duration（持續時間）

options——useEasing（設置寬松）、useGrouping（是否使用千位分隔符）、separator（千位分隔符）、decimal（小數點分隔符）、prefix（前綴符）、suffix（后綴符，可以加單位）

methods——start（開始）、pause/resume（暫停/重新開始）、reset（重置）、update（更新到該值）

4、vue代碼：

 

<i-count-up
    :start="0"
    :end="total"
    :decimals="0"
    :duration="2.5"
    :options="options"
></i-count-up>

 

import ICountUp from 'vue-countup-v2'

export default {
    name: 'dashboard',
    data () {
      return {
        options: {
          useEasing: true,
          useGrouping: true,
          separator: ',',
          decimal: '.',
          prefix: '',
          suffix: ''
        },
        total: 100
      }
    }
}