代码语言:javascript复制
<template>
<view>
<view class="login-item">
<input placeholder="请输入验证码" v-model="loginCode" name="input" class="login-code" maxlength="6" type="number"></input>
<button class="login-getcode" @click="getValCode" :disabled="disabled">{{codeTitle}}</button>
</view>
</view>
</template>
<script>
export default {
data() {
return {
disabled: false,
codeTitle:'获取验证短信',
loginCode:'', //验证码
};
},methods:{
//获取验证码
getValCode(){
let _this = this
//这里写发送验证码接口
loginApi.xxxxx({'phone':_this.telNumber}).then(res =>{
_this.tc.toast('验证码发送成功');
})
_this.disabled = true;
_this.codeTitle = "请稍候...";
setTimeout(() => {
_this.doLoop(60)
}, 500)
},
//验证码倒计时
doLoop: function(seconds) {
let _this = this
seconds = seconds ? seconds : 60;
this.codeTitle = seconds "s后获取";
let countdown = setInterval(() => {
if (seconds > 0) {
_this.codeTitle = seconds "s后获取"
--seconds;
} else {
_this.codeTitle = "获取验证码";
_this.disabled = false;
clearInterval(countdown);
}
}, 1000);
},
}
}
</script>
<style lang="less" scoped>
</style>