介绍 & lt; p>
& lt; block wx:如果=皗{total_micro_second<=0}}“祝辞剩余时间:已经截止& lt;/block>
& lt; block wx:如果=皗{钟!=& # 39;已经截止& # 39;}}“祝辞剩余时间:{{时钟}}& lt;/block>
& lt;/p> function 倒计时(,),{
,var EndTime =, that.data.end_time | |, [];
,var NowTime =, new 日期().getTime ();
,var total_micro_second =, EndTime 作用;NowTime | |, [];
,console.log(& # 39;剩余时间:& # 39;,+,total_micro_second);//才能,渲染倒计时时钟
that.setData({才能
钟才能:dateformat (total_micro_second)
,,});
if 才能;(total_micro_second & lt;=, 0), {
that.setData({才能
,,,钟:“已经截止“;
,,});//返回才能;
,,}
setTimeout(才能function (), {
-=total_micro_second 才能;1000;
倒计时才能(,);
,,}
,,,,1000)
,}
,//时间格式化输出,如11:03 25:19 每1 s都会调用一次
,function dateformat (micro_second), {//才能,总秒数
var 才能;second =, Math.floor (micro_second /, 1000);//才能,天数
var 才能;day =, Math.floor(第二/3600/24);//才能,小时
var 才能;hr =, Math.floor(第二次/24)3600%;//,才能分钟
var 才能;min =, Math.floor(60秒/60%);
,,//秒
var 才能;sec =, Math.floor(第二% 60);
return 才能;day +,“天“,+,hr +,“小时“,+,min +,“分钟,,+,sec +“秒”;
,}
页面({/* *
,*页面的初始数据
,*/,数据:{
,id: & # 39; & # 39;
,结果:[],
,end_time: & # 39; & # 39;
,时钟:& # 39;& # 39;
},/* *
,*生命周期函数——监听页面加载
,*/,onLoad: function (选项),{=,var that ;
,wx.request ({
,,url: & # 39; https://m。* * * * * *.com/index.php/Home/Xiaoxxf/activity_detail?a_id=& # 39; + options.id,//不含富文本html
,,数据:{},
方法:才能,& # 39;得到# 39;,,//,选择,,,,,,,,,,删除,跟踪,连接
头才能:{
& # 39;才能- type # 39;:, & # 39; application/json # 39;
,,},
,,成功:function (res), {
that.setData({才能
,才能共同:res.data,,//一维数组,全部数据
,,,end_time: res.data.end_time //项目截止时间,时间戳,单位毫秒
})才能
console.log才能(that.data.common);
console.log才能(& # 39;结束时间:& # 39;,+,that.data.end_time);
,,},
,,失败:function (res), {,},
,,完成:function (res), {,},
}),大敌;//调用上面定义的递归函数,一秒一刷新时间
,倒计时(,);
},
小编给大家分享一下微信小程序中如何动态显示项目倒计时效果,相信大部分人都还不怎么了解,因此分享这篇文章给大家参考一下,希望大家阅读完这篇文章后大有收获、下面让我们一起去了解一下吧!
1,一般我们说的显示秒杀都是指的单条数据,循环我没做。
效果:
2, wxml代码:
3。js文件代码:
以上是“微信小程序中如何动态显示项目倒计时效果”这篇文章的所有内容,感谢各位的阅读!相信大家都有了一定的了解,希望分享的内容对大家有所帮助,如果还想学习更多知识,欢迎关注行业资讯频道!
