【微信小程序】使用setTimeout制作定时器的思路
setTimeout(func, time)可以使得每隔time毫秒就执行一次func函数,常用来做计时器/时钟。
下面是在微信小程序中的使用思路,只截取了关键部分代码。
var timer; // 计时器
Page({
// ...省略
// 自定义的开始按钮
startBtn: function () {
console.log("开始按钮");
Countdown();
},
// 自定义的暂停按钮
pauseBtn: function () {
console.log("暂停按钮");
clearTimeout(timer);
},
});
// 倒计时
function Countdown() {
timer = setTimeout(function () {
console.log("----Countdown----");
Countdown();
}, );
};
思路:
- setTimeout()延迟指定毫秒数后执行指定函数,可通过递归调用setTimeout()来实现各种计时器功能。
- 如果想做每秒钟刷新一次的时钟,只需每次执行时间转换函数并setData更新界面即可。
- 使用clearTimeout("定时器的名字")可以停下指定的计时器。
下面是Javascript关于时间的转换函数。
// 秒数 --> 时:分:秒
function formatTime(seconds) {
return [
parseInt(seconds / / ), // 时
parseInt(seconds / % ), // 分
parseInt(seconds % ) // 秒
]
.join(":")
.replace(/\b(\d)\b/g, "0$1");
}
另外,做定时重复调用函数的功能时,用setTimeOut()代替setInterval(),因为setInterval()是有误差的!详情参考
参考资料:
【微信小程序】使用setTimeout制作定时器的思路的更多相关文章
- 微信小程序如何开发制作
微信小程序如何开发制作 微容SMO是一款微信小程序的免费在线制作工具,用户在微容平台上无需编辑代码,可通过拖拽式操作即可完成小程序的制作,真正意义上实现了小程序零代码免费制作! 消除技术门槛:无需代码 ...
- 微信小程序分享朋友圈的实现思路与解决办法
实现思路 那么既然小程序没有分享到朋友圈的api,我们怎么实现分享到朋友圈呢,下面我介绍一下实现思路. 既然没有捷径,那就走复杂一点的路线,那就是需要用户手动分享到朋友圈,问题又来了,用户手动分享的话 ...
- 微信小程序零基础制作指南
第一步 准备工作 下载腾讯官方的微信web开发工具并且安装 第二步 登录已经注册小程序的微信账号并且选择合适的路径新建小程序项目. 新建一个页面文件夹,每一个页面需要一个文件夹,里面包括写逻辑脚本的j ...
- 微信小程序canvas 证件照制作
小程序制作证件照过程 利用canvas制作生活中常用的证件照,压缩图片,修改图片dpi.希望给大家带来方便. 证件照小程序制作要点 上传合适的图片,方便制作证件照 调用AI接口,将图像进行人像分割.这 ...
- 微信小程序 使用swiper制作一个滑动导航
最近在做一个导航的时候,发现使用overflow-x: auto来做多内容滑动导航效果很不好,思索是不是可以使用swiper来做一个,研究了下其实发现原理基本相同 这里说下,要用swiper做导航菜单 ...
- 微信小程序纯css制作圆形进度条所遇到的问题
wrapBox:最外层盒子,背景色为进度条的颜色 leftBox/rightBox:半宽等长 左/右浮动的盒子,背景色为灰色 roundMask:居中的盒子 用来遮盖leftBox和rightBox ...
- 微信小程序swiper制作内容高度不定的tab选项卡
微信小程序利用swiper制作内容高度不定的tab选项卡,不使用absolute定位,不定高度,由内容自由撑开主要思路是获取内容区的高度来给swiper动态设置值 .wxml <view cla ...
- 微信小程序制作个人简历
使用微信小程序云开发制作自己的个人简历,简单高效. 首先需要了解小程序的基本结构以及云开发模式,及一些css样式基础. 使用小程序云数据库.vant组件库实现简历内容. 最终效果如下: 首先申请个人微 ...
- 盒马微信小程序
盒马app刚出现,就吸足了眼球.最近看了看盒马界面,很Q,就想着仿照app写个小程序. 功能介绍 好奇微信小程序是如何制作的,也对盒马app感兴趣,就尝试写了这个盒马小程序.实现了app的部分功能,还 ...
随机推荐
- JAVA环境变量的脚本
简单的一个脚本,用于自动设置环境变量.把代码拷贝,另存为javaEnv.bat.安装完Java 2 SDK之后,开一个命令行窗口,输入javaEnv java2SDKDir(java2SDKDir是你 ...
- 从语句 char* p="test" 说起
我相信,使用C/C++多年的人对下面这个字符串赋值语句都不会陌生吧. char* p = "test"; 同时,我也相信,各位在使用这种语句后吃 ...
- 还没被玩坏的robobrowser(6)——follow_link
背景 在做spider的时候,我们经常会有点击链接的需求. 考虑这样的一个简单spider:获取qq.com主页上的今日话题中的内容. 一般思路是先去qq.com首页上找到今日话题的链接,然后点击这个 ...
- nginx+php-fpm性能参数优化原则
1.worker_processes 越大越好(一定数量后性能增加不明显) 2.worker_cpu_affinity 所有cpu平分worker_processes 要比每个worker_pro ...
- 解决tomcat服务器下,只能通过localhost,而不能通过127.0.0.1或者本地ip地址访问的问题
今天在tomcat上部署了一个web应用以后,发现用localhost的方式来访问应用是正常的,但是换成127.0.0.1或者是本地的ip地址来访问,确出现访问不了的情况.之前想是不是防火墙的问题,于 ...
- axios 简单常用笔记
简单认知: 1.config.data是POST参数,config.params是GET参数 axios(url, [config]) + qs + application/x-www-form-ur ...
- Python 爬虫 大量数据清洗 ---- sql语句优化
. 问题描述 在做爬虫的时候,数据量很大,大约有五百百万条数据,假设有个字段是conmany_name(拍卖公司名称),我们现在需要从五百万条数据里面查找出来五十家拍卖公司, 并且要求字段 time( ...
- sql server2008系统表详细说明sys.开头的表
一.库里有多少个表,表名等 select * from INFORMATION_SCHEMA.TABLES 二.查询表.字段.类型.是否主键.长度.小数位.是否允许空.默认值等详细查询 效果: SEL ...
- 腾讯企业邮箱SMTP-邮件发送失败异常:“ SMTPSendFailedException:501 ϵͳÒÑÇ¿ÖÆ¿ªÆôÕʺÅÉý¼¶ÉèÖã¬ÇëµÇ¼e
这里我们在报警发送邮件用的是腾讯的企业邮箱,突然这两天没有报警邮件,很是奇怪 发送邮件报错 SMTP-邮件发送失败异常:“ SMTPSendFailedException:501 ϵͳÒÑÇ¿ÖÆ ...
- linux杀掉tomcat应用进程。停止tomcat应用
ps -ef |grep tomcat |grep -v grep |awk '{print $2}' |xrags kill -9