uniapp 倒计时获取短信验证码

uniapp 倒计时获取短信验证码

代码片.

<template><view><view class="item"><view class="item-input-text"><image class="phone-icon" lazy-load="true" src="static/image/mobile-icon.png"</image><input class="input" placeholder-style="color:#C5CBCE;" v-model="mobil placeholder="请输入手机号" /></view>         </view><view class="item"><view class="item-input-text item-input-code"><image class="phone-icon" lazy-load="true" src="static/image/code-icon.png"></image><input class="input" placeholder-style="color:#C5CBCE;" v-model="code" placeholder="请输入验证码" /></view><view class="item-input-text item-input-codeImg" @tap="getCodeBtn"><text v-if="codeTime>0">{{(codeTime<10&&codeTime>0 )?'0'+codeTime:codeTime }}s后重新获取</text><text v-else>获取验证码</text></view></view></view>
</template<script>export default {data() {return {codeTime: 0,//初始化倒计时mobile: "", //手机号code: "", //输入验证码}},onShow() {},onLoad() {},methods: {getCodeBtn() {if (this.codeTime > 0) {return false;} else {this.codeTime = 60let timer = setInterval(() => {this.codeTime--;if (this.codeTime < 1) {clearInterval(timer);this.codeTime = 0}}, 1000)}}}}
</script>

本文来自互联网用户投稿，文章观点仅代表作者本人，不代表本站立场，不承担相关法律责任。如若转载，请注明出处。 如若内容造成侵权/违法违规/事实不符，请点击【内容举报】进行投诉反馈！