效果

源碼

https://github.com/jarjune/vue-number-scroll

安裝

npm install --save vue-number-scroll

引入

import vns from 'vue-number-scroll'

使用

<vns startNum="0" endNum="99" times="10" speed="50"/>

參數(shù)

參數(shù)名默認值備注

speed	50	跳轉(zhuǎn)的間隔時間(毫秒)
times	10	從開始到結(jié)束，變換的次數(shù)
startNum	0	起始數(shù)值
endNum	0	目標達到的數(shù)值

例子

排名：<vns startNum="0" endNum="99" speed="80" times="20"/>金額：<vns startNum="0" endNum="18299.5" speed="80" times="10"/>

轉(zhuǎn)載于:https://www.cnblogs.com/jarjune/p/10167760.html

總結(jié)

以上是生活随笔為你收集整理的【vue-number-scroll】数字逐渐增加或者减少的滚动解决方案的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯，歡迎將生活随笔推薦給好友。