微信小程序实现倒计时功能（超简单）

声明倒计时长和当前剩余时长（字符串形式），我这里是30分钟（单位为秒）

data: {time:1800,countdown:''},

定义倒计时函数，把倒计时长除以60的整数部分作为分，把倒计时长除以60的余数作为秒；

执行完后减一秒，用定时器每隔一秒执行一次。

如果秒数不够两位，则在秒前加上字符串'0'。如：20:07

countdown(){var minute=Math.floor(this.data.time  / 60 );var second=this.data.time  % 60if(second<10){second='0'+second;this.setData({countdown:minute+':'+second})}else{this.setData({countdown:minute+':'+second})}this.setData({time:this.data.time-1})setTimeout(this.countdown, 1000);},

在页面加载时调用

onLoad(options) {this.countdown()},

wxml：

<text>{{countdown}}</text>

使用三元运算使代码更简洁

countdown(){var minute=Math.floor(this.data.time  / 60 );var second=this.data.time  % 60second<10?second='0'+second:'';this.setData({countdown:minute+':'+second,time:this.data.time-1})setTimeout(this.countdown, 1000);},

微信小程序实现倒计时功能（超简单）相关推荐

黯然微信小程序杂记（三）：微信小程序实现倒计时功能附讲解教学附源码
黯然微信小程序杂记(三):微信小程序实现倒计时功能附超详细注释附源码一.功能描述二.界面展示三.test.wxml代码四.test.js代码(注释很详细很易懂) CSDN私信我,有关微信 ...
微信小程序登录注册功能(超详细)
一键登录微信小程序4月13号新更新getUserInfo要用wx.getUserProfile接口替换 https://blog.csdn.net/qq_28471389/article/detai ...
微信小程序实现倒计时功能
1,小程序仿电商网站秒杀倒计时 2,显示格式为:例如 1天11时11分11秒11 3,秒杀时间结束后提示秒杀结束先看效果图其实实现挺简单  < ...
微信小程序获取当前定位超简单
1:去腾讯地图官网下载地图工具包放到lib文件夹下 2:在所用的js里引入 var QQMapWX = require("../../libs/qqmap-wx-jssdk.js" ...
微信小程序自定义倒计时组件及注意事项
倒计时功能实现:微信小程序实现倒计时功能(超简单)_洛潆的博客-CSDN博客_微信小程序倒计时功能由于要在多个页面使用倒计时功能,在每个页面都重新写一遍就会很麻烦,所以可以把它封装为自定义组件,最终 ...
python控制相机自动拍照_微信小程序实现倒计时调用相机自动拍照功能
这篇文章主要为大家详细介绍了微信小程序实现倒计时调用相机自动拍照功能,具有一定的参考价值,感兴趣的小伙伴们可以参考一下本文实例为大家分享了微信小程序定时拍照的具体代码,供大家参考,具体内容如下在某 ...
【小程序源码】精美UI强大娱乐功能组合微信小程序源码下载,安装简单
这是一个多娱乐功能的小程序具体由以下功能组合: 在线音乐短视频去印外卖CPS(外卖平台优惠劵) 打车CPS(打车平台优惠劵) 头像功能(多分类头像,另外还支持姓氏头像制作) 图片加水印表情包功 ...
微信小程序播放器的一些简单功能实现
微信小程序播放器的一些简单功能实现准备工作一.构建npm(后面用到moment的格式化时间) 二.系统后台监测程序播放器配置(系统后台要知道该播放器是否在播放歌曲,并有一些简单的业务逻辑) 在ap ...
多功能工具箱微信小程序源码下载-操作简单实用流量主小程序
这是一款多功能工具箱小程序! 目前由N款小功能组合成比如: 图片拼接九宫格切图透明昵称文字表情等等上面说的只是一部分该款小程序无需服务器与域名使用微信开发者工具打开文件然后上传提交审核即 ...
微信小程序实现语音识别功能
原标题:微信小程序实现语音识别功能使用小程序实现语音识别功能,由于语音识别可以直接使用各厂家的API接口,并且小程序为腾讯所有,因此考虑到可能的低延时,采用了腾讯提供的免费API接口,准确讲是腾讯语 ...

微信小程序实现倒计时功能（超简单）

微信小程序实现倒计时功能（超简单）相关推荐

最新文章

热门文章