uni验证码60秒倒计时
其实要实现这个功能原理非常简单,就是setInterval+setTimeout+clearInterval结合使用,首先在data里定义一个变量second,初始值为60,然后在setInterval里执行每秒减1的操作,setTimeout在60秒后执行clearInterval清除定时器的操作
<view v-if="showText==true" class="send" @click="getCode">发送验证码</view>
<view v-else class="send">{{second}}s重新发送</view>
data() {
return {
second:60,
showText:true,
};
},
getCode(){//倒计时
this.showText = false
var interval = setInterval(() => {
let times = --this.second
this.second = times<10?'0'+times:times //小于10秒补 0
}, 1000)
setTimeout(() => {
clearInterval(interval)
this.second=60
this.showText = true
}, 60000)
},
uni验证码60秒倒计时的更多相关文章
- button获取验证码60秒倒计时 直接用
__block ; __block UIButton *verifybutton = _GetverificationBtn; verifybutton.enabled = NO; dispatch_ ...
- js实现60秒倒计时效果(使用了jQuery)
今天碰到要实现一个类似那种短信验证码60秒倒计时的需求,好久不写js,有点手生.把代码记录下,方便后续查阅. 这里我用了jQuey,毕竟写起来简洁点.下面直接看效果和代码. 一.效果 ...
- 微信小程序60秒倒计时
微信小程序发送短信验证码后60秒倒计时功能,效果图: 完整代码 index.wxml <!--index.wxml--> <view class="container&qu ...
- jQuery实现发送短信验证码后60秒倒计时
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <script sr ...
- iOS-登录发送验证码时60秒倒计时,直接用
__block NSInteger timeout= ; //倒计时时间 KWeakSelf dispatch_queue_t queue = dispatch_get_global_queue(DI ...
- 获取验证码,60秒倒计时js
<input type="button" id="btn" value="免费获取验证码" /><script type= ...
- JS获取短信验证码60秒
<script language="javascript"> function get_mobile_code(){ $.post("{{ ...
- js jquery 按钮点击后 60秒之后才能点击 60秒倒计时
var wait = 60; function time(o) { if (wait == 0) { $(o).attr("disabled", false); $(o).val( ...
- 点击按钮出现60秒倒计时js代码
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
随机推荐
- idea 添加默认注释
- nginx location指令详解
Nginx的HTTP配置主要包括三个区块,结构如下: http { //这个是协议级别 include mime.types; default_type application/octet-strea ...
- FileChannel详解
经过前两篇文章的学习,相信对Channel有了一定的整体性认识.接下来通过学习本篇文章,更进一步认识Channel,学习FileChannel的细节 用途 特点 api 原理 一.用途 传统IO中的F ...
- mybatis-plus 主键自增问题
主键不自增:返回值是插入的条数 <insert id="add" parameterType="EStudent"> insert into TSt ...
- 封装:WPF绘制曲线视图
原文:封装:WPF绘制曲线视图 一.目的:绘制简单轻量级的曲线视图 二.实现: 1.动画加载曲线 2.点击图例显示隐藏对应曲线 3.绘制标准基准线 4.绘制蒙板显示标准区域 曲线图示例: 心电图示例: ...
- C# vb .NET读取识别条形码线性条码ean-8
ean-8是比较常见的条形码编码规则类型的一种.如何在C#,vb等.NET平台语言里实现快速准确读取该类型条形码呢?答案是使用SharpBarcode! SharpBarcode是C#快速高效.准确的 ...
- Ubuntu 使用scrapy-splash
配置docker 1.更新apt索引: $ sudo apt-get update 2.安装包允许apt通过HTTPS使用仓库: sudo dpkg --configure -a sudo apt ...
- English--动词时态
English|动词时态 时态是一个很玄乎的东西,要么是完全掌握,要么是不知所云. 在正式开始之前,大家需要明白汉语的谓语动词是不会随着时间与状态而变化.但是,英语的谓语动词会随着时间与状态发生变化. ...
- RocketMQ原理及源码解析
RocketMQ原理深入: 一.定义: RocketMQ是一款分布式.队列模型的消息中间件,有以下部分组成: 1.NameServer: 一个几乎无状态的节点,可集群部署,节点之间无任何信息同步 2. ...
- VUE组件3 数据流和.sync修饰符
单向数据流:数据通过prop从父组件传递到子组件中,当父级组件中的数据更新时,传子组件也会更新,但不能在子组件中修改.防止子组件在无意中修改,改变父级组件状态 然而,双向数据绑定在某些情况下有用.如果 ...