<!-- 低价秒杀 -->
<view class='con price-secondkill'>
<view class='catename clearfix'>
<view class='tex-01'>低价秒杀</view>
<view class='tex-02 clearfix'>
<view>距结束</view>
<view class='num'>{{mkill.hou}}</view><view>:</view>
<view class='num'>{{mkill.min}}</view><view>:</view>
<view class='num'>{{mkill.sec}}</view>
</view>
<view class='tex-03' bindtap="discountMoreTap">查看更多></view>
</view>
<view class='discount-list'>
<block wx:for="{{discountList}}">
<view class='item clearfix'>
<view class='img'><image src='{{item.course.img}}' style='width:100%;' mode='widthFix'></image></view>
<view class='tex'>
<view class='tex-top'>
<text>{{item.course.name}}</text>
<text>{{item.course.info}}</text>
</view>
<view class='texts'>
<view class='price'>
<text>¥{{item.price}}</text>
<text>¥{{item.course.price_original}}</text>
</view>
<view class='num'>
<button bindtap="bindCourseView" data-id="{{item.course.id}}">立即秒杀</button>
</view>
</view>
</view>
</view>
</block>
</view>
</view>
/*倒计时*/
countDown:function() {//倒计时函数
// 获取当前时间,同时得到活动结束时间数组
let newTime = new Date().getTime();
let actEndTime = this.data.actEndTime.replace(/-/g, "/");
let endTime = new Date(actEndTime).getTime();
let obj = [];
// 如果活动未结束,对时间进行处理
if (endTime - newTime > 0) {
let time = (endTime - newTime) / 1000;
// 获取时、分、秒
let hou = parseInt(time % (60 * 60 * 24) / 3600);
let min = parseInt(time % (60 * 60 * 24) % 3600 / 60);
let sec = parseInt(time % (60 * 60 * 24) % 3600 % 60);
obj = {
hou: this.timeFormat(hou),
min: this.timeFormat(min),
sec: this.timeFormat(sec)
}
} else {//活动已结束,全部设置为'00'
obj = {
hou: '00',
min: '00',
sec: '00'
}
}
// 渲染,然后每隔一秒执行一次倒计时函数
this.setData({
mkill: obj
})
setTimeout(this.countDown, 1000);
},
需要注意苹果手机倒计时不显示,原因是:IOS不支持2019-08-28 14:01:30这种格式,只需要将 - 替换为 / 即可解决:
var remainDate = "2019-08-28 14:01:30";
var newRemainDate = remainDate .replace(/-/g, "/") //转换后即可兼容啦
wxss就不往外贴了,根据不同的需求,直接写样式即可