12-26 关于Math对象的方法以及动态绑定样式

企业版销户系统的开发

1.遇到一个需要自增时间的计时器需求，时间紧任务重，大概就写了一个不是很聪明的方法如下：
并且注意到，setInterval方法一开始不会调用，第一次调用需要等到间隔以后

 <span>您已持续等待{{waitTime}}{{waitTimeUnit}}</span>

//设置定时器自增时间以及调用接口
  getUserPostion() {
    this.getVideoUserInfo()
    setInterval(() => {
      this.waitTimeSecond = this.waitTimeSecond + 1
      if (this.waitTimeSecond >= 60 && this.waitTimeSecond < 3600) {
        this.waitTimeMin = Math.floor(this.waitTimeSecond / 60)
        this.waitTimeUnit = '分钟'
        this.waitTime = this.waitTimeMin
      } else if (this.waitTimeSecond >= 3600) {
        this.waitTimeHour = Math.floor(this.waitTimeSecond / 3600)
        this.waitTimeUnit = '小时'
        this.waitTime = this.waitTimeHour
      } else {
        this.waitTime = this.waitTimeSecond
      }
      this.getVideoUserInfo()
    }, 1000)
  }

然后好久没写，也忘了处理数字相关的类型转换和原型方法了。复习一下：
留整数，向上取整，四舍五入，向下取整等函数

Math.floor() 与 parseInt()

2.上图的大写的排队序列号，明显需要根据数字的位数进行优化，css里面暂时没有这种方法。就自己封装了一个返回值判断即可：
不得不说，vue这种绑定数据的非常方便。要是原来那种DOM思想，非常麻烦。还得考虑addClass和removeClass

<div class="queue-num" :class="this.setClassFont()">
        <span>{{userInfo.waitPosition}}</span>
      </div>

 //对于座位号进行样式设置
  setClassFont(){
    if(this.userInfo.waitPosition>=10&&this.userInfo.waitPosition<100){
      return 'double-digit'
    }
    else if(this.userInfo.waitPosition>=100){
      return 'three-digit'
    }
  }