vue实现验证码倒计时60秒的具体代码
vue实现验证码倒计时60秒的具体代码
<span v-show="show" @click="getCode">获取验证码</span>
<span v-show="!show" class="count">{{count}} s</span> data(){
return {
show: true,
count: '',
timer: null,
}
},
methods:{
getCode(){
const TIME_COUNT = 60;
if (!this.timer) {
this.count = TIME_COUNT;
this.show = false;
this.timer = setInterval(() => {
if (this.count > 0 && this.count <= TIME_COUNT) {
this.count--;
} else {
this.show = true;
clearInterval(this.timer);
this.timer = null;
}
}, 1000)
}
}
}
vue实现验证码倒计时60秒的具体代码的更多相关文章
- js 验证码 倒计时60秒
js 验证码 倒计时60秒 <input type="button" id="btn" value="免费获取验证码" /> & ...
- js实现倒计时60秒的简单代码
<!DOCTYPE html> <html lang="en"> <head> <meta http-equiv="Conten ...
- jQuery实现发送验证码倒计时60秒
前端HMTL: <div class="form_box"> <div class="line mb40"> <div class ...
- javaScript 验证码 倒计时60秒
<input type="button" id="btn" value="免费获取验证码" /> <script type ...
- js 简单实现获取短信按钮倒计时60秒
<!DOCTYPE html><html lang="en"><head> <meta http-equiv="Content- ...
- iOS-验证码倒计时60秒
一. 要求 1.点击获取验证码按钮,60秒倒计时,按钮变成不可点击状态,按钮文字变成倒计时的秒数. 2.当倒计时为0的时候,释放掉定时器NSTimer,按钮变成可以点击状态,按钮文字变成"获 ...
- Android 实现简单 倒计时60秒,一次1秒
倒计时功能如上图所示,其实就几行代码即可实现效果啦!!! /** 倒计时60秒,一次1秒 */ CountDownTimer timer = new CountDownTimer(60*1000, 1 ...
- Jquery插件实现点击获取验证码后60秒内禁止重新获取
通过jquery.cookie.js插件可以快速实现“点击获取验证码后60秒内禁止重新获取(防刷新)”的功能 先到官网(http://plugins.jquery.com/cookie/ )下载coo ...
- jQuery实现发送短信验证码后60秒倒计时
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <script sr ...
随机推荐
- react-native flatlist 上拉加载onEndReached方法频繁触发的问题
问题 在写flatlist复用组件时,调用的时候如果父组件是不定高的组件,会造成组件无法显示 如果父组件样式{flex:1},则会出现下拉方法频繁触发或不正常触发的问题(我这里出现的问题是在列表第6个 ...
- Python基础 之for循环嵌套实例
一.在控制台中输出以下字符样式: """ ***** ***** *****&qu ...
- 一篇搞懂python文件读写操作(r/r+/rb/w/w+/wb/a/a+/ab)
关于文件操作的几种常用方式,网上已有很多解说,内容很丰富,但也因此有些杂乱复杂.今天,我就以我个人的学习经验写一篇详细又易懂的总结文章,希望大家看完之后会有所收获. 一.核心功能 ‘r’ ...
- CQL语句
CQL中默认忽略大小写,若需要大小写敏感,可使用双引号将对象包起来,引用的时候也要用双引号包住 tips: 使用CQL需要预装Python环境 Ⅰ.基本知识点 1.1 数据类型 这边和关系型数据库相近 ...
- hadoop学习笔记--找到执行hadoop的入口
参与个hadoop项目,之前没搞过,赶紧学习: 照葫芦画瓢,得到代码是hdfs2local.sh脚本和LiaoNingFilter.jar包,迫不及待用jd-gui打开jar包,搜索到main(在MA ...
- flask学习笔记(1)-虚拟环境安装
Mac(类Linux): pip install virtualenv mkdir testvirtualenv cd testvirtualenv virtualenv flask-env#创建虚拟 ...
- .net拼接json字符串
{ while (reader.Read()) { if (reader.HasRows) { JSONstring += "{"; JSONstring += "\&q ...
- python基础-->流程控制-->分支结构-->单项分支-->双向分支
# ###流程控制 ''' 流程:代码执行过程 流程控制:对代码执行过程的管控 顺序结构:代码默认从上到下依次执行 分支结构:对代码执行过程的管控 循环机构: while for ..in.... 分 ...
- ORACLE——获取随机数
在oracle中获取一个指定的随机数: --(DBMS_RANDOM.VALUE(INT NUM1,INT NUM2),比如: ,) FROM DUAL; --结果:8.23602331029803 ...
- 创建存储过程 in,out,inout
in: 输入参数,存储过程如果修改了参数值,那么不能被返回. out:输出参数,存储过程中修改了参数值,可以被返回.inout:输入参数,存储过程如果修改了参数值,可以被返回 注意参数格式: in ...