首页 > 其他 > 详细

unaipp 发送验证码倒计时

时间:2020-07-05 16:02:38      阅读:63      评论:0      收藏:0      [点我收藏+]

view代码

<view class="margin-top" @tap="getCheckNum()">
      <view class="bg-purple">{{!codeTime?‘获取验证码‘:codeTime+‘s‘ + ‘后重试‘}}</view>
</view>

css代码

.bg-purple {
    text-align: center;
    line-height: 45px;
    border-radius: 50px;
 }

js代码

    export default {
        data() {
            return {
                codeTime: 0,
            }
        },
        methods: {
            getCheckNum() {
                if (this.codeTime > 0) {
                    uni.showToast({
                        title: ‘不能重复获取‘,
                        icon: "none"
                    });
                    return;
                } else {
                    this.codeTime = 60
                    let timer = setInterval(() => {
                        this.codeTime--;
                        if (this.codeTime < 1) {
                            clearInterval(timer);
                            this.codeTime = 0
                        }
                    }, 1000)
                }
            }
        },


    }

 

unaipp 发送验证码倒计时

原文:https://www.cnblogs.com/sxdpanda/p/13246290.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!