vue 数字动画递增_vue 实现数字滚动增加效果的实例代码

项目中需要做数字滚动增加的效果，一开始很懵，研究了一下原理，发现很简单，贴出来分享一下 ^_^

数字滚动组件：

0

export default {

props: {

time: {

type: Number,

default: 2

},

value: {

type: Number,

default: 720000

}

},

methods: {

numberGrow (ele) {

let _this = this

let step = (_this.value * 10) / (_this.time * 1000)

let current = 0

let start = 0

let t = setInterval(function () {

start += step

if (start > _this.value) {

clearInterval(t)

start = _this.value

t = null

}

if (current === start) {

return

}

current