关于前端:jsVue实现数字金额滚动动画

实现成果

数字金额定时滚动减少，最初展现成字符串格局

代码如下：

<span class="data-add-rate" :dataValue="num">{{num}}</span>

<script>
    ...
    methods:{autoAdd(sel){
            let times = 0;
            let total = 30;
            let $sel = $(sel);
            let intHand = window.setInterval(function(){$sel.each(function(){let $this = $(this);
                    let data = parseFloat($this.attr("dataValue"));
                    let number = parseFloat(data*times/total);
                    $this.text(app.getString(number));
                    //app.getString() 是将 number 转换位字符串的函数})
                if(times === total){window.clearInterval(intHand);
                }else{times++;}
            },20);
        }
       // 调用时
       this.autoAdd('.data-add-rate');
    }
    ...
</script>