数字三位数后加逗号

需求背景： 最近做首页，需求是数字的动态增长及数字的三位数加逗号，金额的显示处理。

1.如何处理整数。需求：整数每三位数一个逗号。
Vue 项目，使用filters函数。在export default 里写该函数。然后{{val | numFormat}},即可生效。

filters:{
    numFormat(val)  {
      if(!val)  return '0'
      return val.toString().replace(/(\d)(?=(?:\d{3})+$)/g,'$1,')
  }
}

2.处理金额数字的过滤函数。在export default 里写该函数。然后{{val | dollarNum}},即可生效。

filters:{
    dollarNum(val) {
      if(!val) return '0.00'
      const intPart = Number(val).toFixed(0) //获取整数部分
      const intPartFormat = intPart.toString().replace(/(\d)(?=(?:\d{3})+$)/g,'$1,') //整数部分逢三断一
      let floatPart = '.00'
      const valArray = val.split('.') 
     if(valArray.length === 2) {
         floatPart = valArray[1].toString()
         if (floatPart.length === 1) {
           return `${intPartFormat}.${floatPart}0`
         } else {
           return `${intPartFormat}.${floatPart}`
         }
      } else {
          return `${intPartFormat}${floatPart}`
       }
   }
}

3.数字增长的动态显示。

<span ref="numberGrow"  :data-time= "time" :data-value="totalInfo.value">0</span>

data() {
  return {
    time: 2
  }
}
//这个写到methods里
numberGrow(ele) {
    const _this = this
    const step = Math.ceil((_this.totalInfo.value * 10) / (_this.time * 1000))
    let current = 0
    let start = 0
   let t = setInterVal (function(){
      start += step 
      if (start > _this.totalInfo.value) {
        clearInterval(t)
        start = _this.totalInfo.value
        t = null
     }
    if (current ==== start) {
        return
    }
    current = start 
    ele.innerHtml = current.toSting().replace(/(\d)(?=(?:\d{3})+$)/g,'$1,')
  },10)
}
// 使用：在请求回来的数据后，调用该方法，即可实现动态增长数据。
this.numberGrow(this.refs.numberGrow)