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/ ...
随机推荐
- [转帖]【Ubuntu】Ubuntu 各版本代号简介
[Ubuntu]Ubuntu 各版本代号简介 https://www.jianshu.com/p/7b351fde8799 一.版本及代号说明 Ubuntu中,每个版本都有一个更为特色的名字,这个名字 ...
- DataTable Linq Group Count where写法
DataTable dataTable = new DataTable(); dataTable.Columns.Add("username", typeof(string)); ...
- 利用TCHART做分离饼形图
https://www.cnblogs.com/gaodu2003/archive/2009/06/18/1505720.html unit Unit1; interface ……type TFor ...
- java 简单工具
1.String操作 /** * 根据正则字符串过滤不需要的字符串 * @param arr * @param regex * @return */ public static String[] fi ...
- 8. Scala面向对象编程(高级部分)
8.1 静态属性和静态方法 8.1.1 静态属性-提出问题 有一群小孩在玩堆雪人,不时有新的小孩加入,请问如何知道现在共有多少人在玩?请使用面向对象的思想,编写程序解决 8.1.2 基本介绍 -Sca ...
- java数字前面补充0公共方法
- 定时删除10天前的Es索引
说明 主要用在索引名为 xxxx-yyyy.MM.dd 这种,可以自定义修改下边的脚本 删除索引shell 创建 delete_es_indices_over_10_day.sh #!/bin/bas ...
- jq动画插件,自制基于vue的圆形时钟
首先附上jq插件库,里面的东西太炫了,建议学前端的可以看看学习下:http://www.jq22.com/ 里面有个“超个性动画版本的个人简历”,通过屏幕上不断打印内容,改变相应样式来实现动画简历,我 ...
- WPF解决WindowsFormsHost背景透明
项目案例:WPF使用WindowsFormsHost播放视频,视频上显示边框.字幕等特效: 难点问题 1.WindowsFormsHost不支持背景透明: 2.WPF Panel.ZIndex无效,W ...
- robotframework-ride1.7.3.1更新安装
在2019年之前,robotframework-ride的版本一直是1.5.2.1,是2016年1月份的版本,里面需要使用 wxPython2.8-win64-unicode-2.8.12.1-py2 ...