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 ...
随机推荐
- requirejs的使用和快速理解
样例来自https://www.jianshu.com/p/b8a6824c8e07 requirejs有以下功能 声明不同js文件之间的依赖 可以按需.并行.延时载入js库 可以让我们的代码以模块化 ...
- textarea 中的换行符
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- python获取文件所在目录
1.执行的python程序获取自己文件所在目录 import os,sys os.chdir(sys.path[0]); dir_name = os.path.abspath(os.path.join ...
- Python学习之旅(三十八)
Python基础知识(37):访问数据库(Ⅱ) 二.MySQL MySQL是Web世界中使用最广泛的数据库服务器.SQLite的特点是轻量级.可嵌入,但不能承受高并发访问,适合桌面和移动应用.而MyS ...
- python语法_字典_字典操作
字典:使用映射关系来存储数据的 数据类型 dict = {''name“:"gm","age":"34"} 采用键值对来存储数据 key_v ...
- String对象方法属性总结
常用属性: constructor;length;prototype;(不在解释): 常用方法: charAt(index);返回指定位置的字符. concat(stringX);连接字符串. ind ...
- Linux命令 at cron
at: 可以处理仅执行一次就结束排程的指令.需要atd服务 crontab: 所设定的指令将会循环地一直进行下去.需要crontab服务 at: Ubuntu16.04 默认没有安装atd服务.安装命 ...
- Python 模块定义、导入、优化详解
一.定义 模块:用来从逻辑上组织 python 代码(变量,函数,类, 逻辑:实现一个功能),本质就是 .py 结尾的 python文件(例如:test.py文件,对应的模块名:test) 包:用来从 ...
- 《ABCD组团队》第二次作业
ABCD组:二手车价格预测系统 项目 内容 这个作业属于哪个课程 http://www.cnblogs.com/nwnu-daizh/ 这个作业的要求在哪里 https://www.cnblogs.c ...
- python基础的学习
今日内容 1.常见操作系 1.win win7 win10 window serrer 2.linux centons 图像界面差 upuntu 个人开发(图形化较好) redhat 企业 3.mac ...