vue实现验证码倒计时功能
html:12<span v-show="show" @click="getCode">获取验证码</span><span v-show="!show" class="count">{{count}} s</span&am
·
html:
1 2 |
|
js:
data(){
return
{
show:
true
,
count:
''
,
timer:
null
,
}
},
methods:{
getCode(){
const TIME_COUNT = 60;
if
(!
this
.timer) {
this
.count = TIME_COUNT;
this
.show =
false
;
this
.timer = setInterval(() => {
if
(
this
.count > 0 &&
this
.count <= TIME_COUNT) {
this
.count--;
}
else
{
this
.show =
true
;
clearInterval(
this
.timer);
this
.timer =
null
;
}
}, 1000)
}
}
}
更多推荐
已为社区贡献33条内容
所有评论(0)