需求:发送短信的返回成功结果后60内不能触发 解决思路
1、设置两个按钮 在点击触发时loading接口返回成功后
2、切换倒计时状态按钮
3、60S结束后切换回发送短信按钮
1.<van-button
@click="sendOut"
v-show="!showButtonELse"
:loading="listloading"
size="small"
type="primary"
>发送短信</van-button>
<van-button
size="small"
type="primary"
v-if="showButton"
style="height: 30px"
>({{ timer }})秒后发送短信</van-button
>
data里设置初始值time、timer、showButton、showButtonELse
time(用来设置定时器 用来实现倒计时功能)
timer(初始值60S)
showButtonELse:false
showButton:false
countDown() {
this.time = setInterval(() => {
if (this.timer == 0 || this.timer < 0) {
clearInterval(this.time);
this.showButton = false;
this.showButtonELse = false;
this.timer = 60;
} else {
this.timer--;
}
}, 1000);
},