uso do temporizador vue

1. Cenários de uso

De acordo com a posição do frame do rosto pressionado por ws, desenhe-o na tela; se a mensagem não for recebida após mais de 500ms, limpe a tela. Captura de tela abaixo:

Dois, o código é o seguinte

/**
* timeTotal   number   500ms 倒计时
* interval  number   计时器间隔 100ms    每100ms执行一次
*/
listenNoMsg(timeTotal, interval) {
  const TIME_COUNT = timeTotal;
  let count = TIME_COUNT;
  if (this.detectTimer) this.resetDetectTimer(); 
  this.detectTimer = setInterval(() => {
    if (count > 0 && count <= TIME_COUNT) {
      count -= interval;
    } else {
      this.rectCtx.clearRect(0, 0, this.width, this.height);
      this.resetDetectTimer();
    }
  }, interval);
},
 //清理定时器
resetDetectTimer() {
  clearInterval(this.detectTimer);
  this.detectTimer = null;
},

A chamada é a seguinte:

  this.listenNoMsg(500, 100);