view代码

<view class="margin-top" @tap="getCheckNum()">
<view class="bg-purple">{{!codeTime?'获取验证码':codeTime+'s' + '后重试'}}</view>
</view>

css代码

.bg-purple {
text-align: center;
line-height: 45px;
border-radius: 50px;
}

js代码

    export default {
data() {
return {
codeTime: 0,
}
},
methods: {
getCheckNum() {
if (this.codeTime > 0) {
uni.showToast({
title: '不能重复获取',
icon: "none"
});
return;
} else {
this.codeTime = 60
let timer = setInterval(() => {
this.codeTime--;
if (this.codeTime < 1) {
clearInterval(timer);
this.codeTime = 0
}
}, 1000)
}
}
}, }

unaipp 发送验证码倒计时的更多相关文章

  1. js&jq 发送验证码倒计时

    <input  type="text"   name=''  id="btn"> //发送验证码倒计时var wait=30; function t ...

  2. react native中的聊天气泡以及timer封装成的发送验证码倒计时

    今天看来情书写的文章,研究了一下大佬写的文章,自己做一点总结. 其实,今天我想把我近期遇到的坑都总结一下:1.goBack的跨页面跳转,又两种方法,一可以像兔哥那样修改navigation源码,二可以 ...

  3. jQuery实现的手机发送验证码倒计时效果代码分享

    这是一款基于jquery实现的手机发送验证码倒计时效果代码,可实现实时显示秒数倒计时的功能,还可实现对手机号码格式验证的功能,是一款常用的网站注册发送手机验证码特效代码. 效果描述:注册一个网站,当需 ...

  4. jQuery实现发送验证码倒计时60秒

    前端HMTL: <div class="form_box"> <div class="line mb40"> <div class ...

  5. 34 Flutter仿京东商城项目 用户注册 注册流程 POST发送验证码 倒计时功能 验证验证码

    加群452892873 下载对应34课文件,运行方法,建好项目,直接替换lib目录 以下列出的是本课涉及的文件. RegisterFirst.dart import 'package:flutter/ ...

  6. js实现发送验证码倒计时按钮

    在写注册页面时,有时候需要发送注册邮件来获取验证码,但是为了防止多次重复发送邮件, 必须让按钮隔一段时间后才能再次使用. 代码如下: <html> <head> <met ...

  7. jQuery手机发送验证码倒计时代码

    <!DOCTYPE> <html> <head> <meta charset="UTF-8"> <script type=&q ...

  8. js 发送验证码倒计时

    首先写一个按钮: <input type="button" id="btn" value="免费获取验证码" onclick=&quo ...

  9. js实现发送验证码倒计时效果

    <!doctype html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  10. 发送验证码倒计时60s

    var wait=60; function time(o) { if (wait == 0) { o.removeClass("gray"); o.text("发送验证码 ...

随机推荐

  1. 重新整理数据结构与算法(c#)—— 顺序存储二叉树[十九]

    前言 二叉树顺序存bai储是二叉树的一种存储方式.将二du叉树存储在一zhi个数组中,通过存储元素的下dao标反映元素之间的父子关系. 正文 这个概念比较简单,比如一个节点的在数组的index是x,那 ...

  2. 重新整理数据结构与算法(c#)——算法套路k克鲁斯算法[三十]

    前言 这个和前面一节有关系,是这样子的,前面是用顶点作为参照条件,这个是用边作为参照条件. 正文 图解如下: 每次选择最小的边. 但是会遇到一个小问题,就是会构成回路. 比如说第四步中,最小边是CE, ...

  3. Pytorch-tensor的激活函数

    1.激活函数 激活函数的作用是能够给神经网络加入一些非线性因素,使得神经网络可以更好地解决较为复杂的问题.因为很多问题都不是线性的,你只有给它加入一些非线性因素,就能够让问题更好的解决. 函数1:RE ...

  4. 实训篇-JavaScript-陶渊明去没去过桃花源

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...

  5. 迁移 Express 到函数计算

    首先介绍下在本文出现的几个比较重要的概念: 函数计算(Function Compute): 函数计算是一个事件驱动的服务,通过函数计算,用户无需管理服务器等运行情况,只需编写代码并上传.函数计算准备计 ...

  6. 更便捷:阿里云DCDN离线日志转存全新升级

    简介: 1月6日,阿里云CDN年度产品升级发布会中,阿里云CDN产品专家邓建伟宣布DCDN离线日志转存全新升级,并对离线日志转存方案的价值.应用及使用进行了详细解读. 在日常CDN加速服务过程中会产生 ...

  7. 基于 RocketMQ Prometheus Exporter 打造定制化 DevOps 平台

    简介: 本文将对 RocketMQ-Exporter 的设计实现做一个简单的介绍,读者可通过本文了解到 RocketMQ-Exporter 的实现过程,以及通过 RocketMQ-Exporter 来 ...

  8. dotnet ConditionalWeakTable 的底层原理

    在 dotnet 中有一个特殊的类,这个类能够做到附加属性一样的功能.也就是给某个对象附加一个属性,当这个对象被回收的时候,自然解除附加的属性的对象的引用.本文就来聊聊这个类的底层原理 小伙伴都知道弱 ...

  9. Ansible的yaml文件

    ansible提供的脚本,遵循规范yaml(一般用于写配置文件) 可用于配制文件的语言:yaml.xml.json - 冒号后面必须有空格 - 横线后面必须要空格 - 严格保持对齐 - 等号前面不能有 ...

  10. 指定Task任务顺序执行

    经常听到说线程池这个东西,凭印象写了个这么简单的例子. CusTRun方法要不要await,取决于要不要作为后台任务.任务可指定数量,线程参数可共享全,顺序可控,可继续改进. using System ...