**
**
<template> <div class="login"> <van-button @click="verification" :disabled="disabled"> <template v-if="isShow">获取验证码</template> <template v-else>{{ outTime }}秒后重发</template> </van-button> </div> </template> return { disabled: false, // 判断是否发送验证码吗 time: null, // 设置默认定时器为null isShow: true, // 获取验证码禁用标识 outTime: 60 // 设置验证码倒计时时间 } }, verification () { if (this.disabled) return this.disabled = true // 禁用发送验证码按钮 this.isShow = false // 隐藏获取验证码字符串 if (!this.time) { // 当定时器不为null时 this.time = setInterval(() => { this.outTime = this.outTime - 1 // 没过一秒数字减一 if (this.outTime < 0) { // 倒计时结束清除定时器 clearInterval(this.time) this.isShow = true // 显示获取验证码字符串 this.outTime = 60 this.time = null this.disabled = false //将按钮设置为可用状态 } }, 1000) // 每秒执行一次 } }