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/ ...
随机推荐
- 记lombok@Data和@Builder一起用无法添加无参构造方法的坑
转自:https://blog.csdn.net/w605283073/article/details/89221853 今天和小伙伴讨论一个mybatis-plus的一个诡异问题,最后定位到原因竟然 ...
- python selenium IE Firxfor pyinstaller
以前在python环境下selenium 主要用的是chromdriver,这次发现老是报错(Timeout), 实际又是正确的, 可能是和chrome版本不正确,再加上我程序蹦来就在windows环 ...
- 【题解】最长递增路径 [51nod1274]
[题解]最长递增路径 [51nod1274] 传送门:最长递增路径 \([51nod1274]\) [题目描述] 一个可能有自环有重边的无向图,每条边都有边权.输入两个整数 \(n,m\) 表示一共 ...
- c#按指定长度分解数组
在操作数据库时,我们需要注意一点,就是in查询的参数不能超过1000个,否则会报错,所以我们在进行in查询的时候需要对参数数量进行控制: 用于分解数组的扩展方法: /// <summary> ...
- 推送一个docker 使用阿里docker hub
阿里docker hub 地址 打开容器镜像服务页https://cr.console.aliyun.com/cn-qingdao/namespaces 这个是我的私有库 配置加速 我这边用的也是阿里 ...
- Vue传递方法给页面调用
很多人在使用vue的时候苦于在vue中写方法,但是在外部甚至在另一个js该如何调用呢? 这个方法就是显示了vue的可以传递方法到页面使得页面任何地方都可以调用 前提得引用文件 这个方法一般多用于加载周 ...
- c#高效准确的条形码、线性条码、QR二维码读写类库-SharpBarcode介绍
SharpBarcode是一款支持.NET(C#,VB)的高效易用的条形码.QR二维码的读取和生成类库. 主要功能: 1.支持几乎所有常见类型的线性条形码和QR二维码的读取,高效读取,准确率高. 2. ...
- .net core Identity注册用户 出错
使用微软自带的注册 报 NotSupportedException: No IUserTwoFactorTokenProvider<TUser> named 'Default' is re ...
- python numPy模块 与numpy里的数据类型、数据类型对象dtype
学习链接:http://www.runoob.com/numpy/numpy-tutorial.html 官方链接:https://numpy.org/devdocs/user/quickstart. ...
- pandas-20 DataFrame()的基本操作
pandas-20 DataFrame()的基本操作 感觉上pandas的DataFrame就像numpy中的矩阵,不过它拥有列名和索引名,实际操作起来会更方便一些. 如: df = pd.read_ ...