老师，我想实现倒计时60秒，但是怎么就是不行呢？

Question

![

Answer 1

扬_灵 2020-05-21 15:22:30

同学你好，我在本地运行你的代码是可以的，实现的是获取验证码倒计时60秒，能不能把你的问题说详细点，不过在运行你代码的时候发现的几个问题：

     1. 第一次启动正常但是在第二次启动的时候就出现问题了，在时间没结束时会创建多个定时器更改seconds的值，

    2. 当时间结束之后再次点击时间没有从59开始。

你可以把定时器定义成data的一个属性，默认为空，每次点击获取验证码的时候判断this.timer是否存在，只有为空的时候才执行定时器的内容。等执行完毕之后在恢复默认值就好了。第二个问题是在定时器结束的时候需要将时间恢复为59不然第二次执行的时候就是从0开始的

countDown () {
    if (!this.timer) {
        this.isSend = true
        this.timer = setInterval(() => {
            this.seconds--
            if (this.seconds === 0) {
                clearInterval(this.timer)
                this.timer = ''
                this.seconds = 59
                this.isSend = false
            }
        }, 1000)
    }
}

如果不能解决你的问题，可以继续追问。

• 提问者 慕无忌4210873 #1

  每次点击获取验证码按钮后，按钮的文本变成（59秒后重新获取），就一直59秒...然后突然又变回（获取验证码）。经过老师改造后的方法就可以跑起来了。谢谢老师，问题解决了。（hm……，老师从哪里看到会创建多个定时器的呢？）

• 扬_灵 回复 提问者 慕无忌4210873 #2

  同学你好，在源代码中countDown函数中的每次点击的时候都会执行创建timer，如果在第一个定时器没有执行完毕的时候再次点击按钮这时就会出现倒计时加快的效果

Answer 2

扬_灵 2020-05-21 09:33:07

同学你好，这个逻辑是没有问题的，你可以把代码上传一下吗，我在本地看一下

• 提问者 慕无忌4210873 #1

  代码：https://git.imooc.com/ZENGAHB/junkie/src/master/ewallet