【微信小程序】【可重用代码】基于数据库时间实现商品倒计时

最近做拍卖小程序,里面有一个需求是监控拍卖时间,需要对时间进行动态的倒计时显示

从构思开始,做这个倒计时也花了我4个小时多,也遇到了很多问题,现在我把完整的功能给实现了,可以拿来套用,只需要传入你自己数据库的时间即可。

1、第一个函数

//传入数据库结束时间参数并计算倒计时 countdown(endTime){//取出竞拍结束时间,精确到秒,如果数据库设置的是精确到毫秒,这里需要再除以1000 let auctionEndtime = res.data.end_time console.log(res) //获取当前系统时间,默认精确到毫秒,这里要用秒,所以除以1000 var nowTime = new Date().getTime() / 1000 //剩余时间总的秒数 var totalSecond = Math.floor(auctionEndtime - nowTime) console.log('剩余秒数',totalSecond) //计算倒计时 this.doCountdown(totalSecond) }

2、第二个函数

 //计算商品倒计时 doCountdown(totalSecond){ let _this = this //每隔一秒执行一次代码,将计数器赋值给页面变量myTime myTime = setInterval(function () { //如果竞拍已经结束 if(totalSecond < 0){ _this.setData({ clock: '' }) clearInterval(myTime) return }else{ //执行计算 var time = _this.formatTime(totalSecond) _this.setData({ clock: time }) } totalSecond --; },1000) },

注意,需要在page()上面定义页面全局变量myTime,以便对计数器进行清除

 

 3、第三个函数

//倒计时时间格式化 formatTime(totalSecond){ //剩余天数 var day = Math.floor(totalSecond / 3600 / 24) //n天后剩余小时数 var hour = Math.floor(totalSecond /3600 % 24) //n天n小时后剩余分钟数 var min = Math.floor(totalSecond / 60 % 60) //n天n小时n分钟后剩余秒数 var sec = Math.floor(totalSecond % 60) return day + "天" + hour + "小时" + min + "分" + sec + "秒" }

4、计数器的清除

每次离开页面需要清除计数器

 


__EOF__

本文作者小李不背锅
本文链接https://www.cnblogs.com/lishilin-glut/p/16506653.html
关于博主:评论和私信会在第一时间回复。或者直接私信我。
版权声明:本博客所有文章除特别声明外,均采用 BY-NC-SA 许可协议。转载请注明出处!
声援博主:如果您觉得文章对您有帮助,可以点击文章右下角推荐一下。您的鼓励是博主的最大动力!
posted @   小李不背锅  阅读(224)  评论(0编辑  收藏  举报
相关博文:
阅读排行:
· Manus爆火,是硬核还是营销?
· 终于写完轮子一部分:tcp代理 了,记录一下
· 震惊!C++程序真的从main开始吗?99%的程序员都答错了
· 别再用vector<bool>了!Google高级工程师:这可能是STL最大的设计失误
· 单元测试从入门到精通
点击右上角即可分享
微信分享提示