微信小程序倒计时方法封装

最近在做一个商城小程序的时候在订单部分有用到倒计时，比如说未支付订单在一定时间后自动关闭订单，这个时候在前端页面上就要展示倒计时。

先封装一个把时间戳转化成天时分秒格式数据的方法，这个方法也可以用于单纯的数据转换：

//timeStamp是时间戳  在这个场景下是距离订单自动关闭的时间差
getTime: function(timeStamp){var day = 0;var hours = 0;var minute = 0;var seconds = 0;day = Math.floor(timeStamp / 1000 / 60 / 60 / 24);//计算天数hours = Math.floor(timeStamp / 1000 / 60 / 60 % 24);minute = Math.floor(timeStamp / 1000 / 60 % 60);seconds = Math.floor(timeStamp / 1000 % 60);var h = this.toDouble(hours);var m = this.toDouble(minute);var s = this.toDouble(seconds);var rest_time={'day':day,'hours':h,'minutes':m,'seconds':s}this.setData({rest_time:rest_time});},toDouble:function(n){   //将时分秒转化成二位数格式return n < 10 ? "0" + n : n;},

然后在onLoad生命周期里写一个定时器，每隔一秒钟时间差减一并执行一次此方法：

为了以后方便复制粘贴，还是要附上代码：

onLoad: function (options) {var that=this;app.ajax('order/orderDetail','post',function(res){console.log(res);if(res.data.code==200){that.setData({orderInfo: res.data.data});// 倒计时var flag=setInterval(function(){var timeStamp = that.data.orderInfo.order_detail.rest_time;if (timeStamp*1000>0){timeStamp--;that.setData({'orderInfo.order_detail.rest_time':timeStamp});that.getTime(timeStamp*1000);}else{clearInterval(flag);}}, 1000)}},{order_id:options.id});},

微信小程序倒计时方法封装相关推荐

uniapp 微信小程序登录方法封装
uniapp 微信小程序登录方法封装前言一.登录接口二.登录上代码总结前言 ui设计没有登录页所以将微信小程序登录方法同一封装一个方法一.登录接口 uni.getUserProfile ...
小程序promise封装post请求_微信小程序 es6-promise.js封装请求与处理异步进程
微信小程序 es6-promise.js封装请求与处理异步进程下载es6-promise.js置于根目录下的libs文件夹下: 在根目录utils文件夹下新建httpsPromisify.js,即定 ...
微信小程序canvas2d使用封装与案例使用
微信小程序canvas2d使用封装与案例使用,看一下这边封装效果 canvas2d文档:https://www.canvasapi.cn/ 下载地址:https://download.csdn.net ...
PbootCMS微信小程序API的封装使用教程
PbootCMS微信小程序API的封装使用教程原文网址:https://www.lkcms.top/rgcms/58.html 第一步:准备md5加密文件 PbootCMS的签名参数signatur ...
微信小程序setdata方法
微信小程序setdata方法微信小程序中有时候需要从其他位置获取数据在前端调用一般会用到小程序中封装好的setdata方法: /** `setData` 函数用于将数据从逻辑层发送到视图层*(异步 ...
微信小程序倒计时实现
微信小程序倒计时实现 a.wxml <view class="daojishi"><text>{{day}}</text>天<text&g ...
微信小程序getday方法_日期getDay（）方法和JavaScript中的示例
微信小程序getday方法 JavaScript Date getDay()方法 (JavaScript Date getDay() method) getDay() method is a Date ...
微信小程序怎么开通（自己申请开通微信小程序的方法）
微信小程序怎么开通(自己申请开通微信小程序的方法) 很多粉丝朋友想要了解微信小程序怎么开通,自己想要申请开发同微信小程序.本文瀚林就给大家分享自己开通微信小程序的方法. 在操作之前,首先要大家清楚明白 ...
微信小程序定位权限封装
微信小程序定位权限封装 getUserOrSystemPermissions.js //如需动态获取权限,修改res.authSetting['scope.userLocation']与scope: ...

微信小程序倒计时方法封装

微信小程序倒计时方法封装相关推荐

最新文章

热门文章