<style lang="less">
</style>
<template>
<view class="container">
<text style="display: block;text-align: center;font-size: 30px;color: #f60;margin-top: 50px;">
{{clock}} {{microSecond}}
</text>
</view>
</template>
<script>
import wepy from 'wepy'
export default class me extends wepy.page {
config = {
navigationBarTitleText: 'me'
}
onLoad() {
console.log('onLoad')
countdown(this)
}
data={
clock: ''
}
}
var totalMicroSecond = 10000 * 1000
/* 毫秒级倒计时 */
function countdown(that) {
// 渲染倒计时时钟
that.setData({
clock: dateformat(totalMicroSecond)
})
if (totalMicroSecond <= 0) {
that.setData({
clock: '已经截止'
})
// timeout则跳出递归
return
}
setTimeout(function() {
// 放在最后--
totalMicroSecond -= 10
countdown(that)
}
, 10)
}
// 时间格式化输出,如03:25:19 86。每10ms都会调用一次
function dateformat(microSecond) {
// 秒数
var second = Math.floor(microSecond / 1000)
// 小时位
var hr = Math.floor(second / 3600)
// 分钟位
var min = fillZeroPrefix(Math.floor((second - hr * 3600) / 60))
// 秒位
var sec = fillZeroPrefix((second - hr * 3600 - min * 60))// equal to => var sec = second % 60;
// 毫秒位,保留2位
var microSec = fillZeroPrefix(Math.floor((microSecond % 1000) / 10))
return hr + ':' + min + ':' + sec + ' ' + microSec
}
// 位数不足补零
function fillZeroPrefix(num) {
return num < 10 ? '0' + num : num
}
</script>