vue列表秒杀倒计时

使用组件：

<count-down :dateTime="taskDueTime"></count-down>   

组件：

<template>
<view class="timeBox" v-if="countdownShow">
    <text class="value" v-if="pageData.day > 0">{{ pageData.day }}</text><text class="label"
        v-if="pageData.day > 0">天</text>
    <text class="value">{{ pageData.hour }}</text><text class="label">:</text>
    <text class="value">{{ pageData.minute }}</text><text class="label">:</text>
    <text class="value">{{ pageData.second }}</text>
</view>
</template>
<script>
export default {
    name: "count-down",
    data() {
        return {
            countdownShow: true,
            pageData: {
                day: '0',
                hour: '00',
                minute: '00',
                second: '00'
            }
        };
    },
    props: {
        dateTime: {
            type: String
        }
    },
    created() {
        this.interval = setInterval(() => {
            this.getCountdown()
        }, 1000);
    },
    beforeDestroy() {
        clearInterval(this.interval)
    },
    methods: {
        getCountdown() {
            const endTime = new Date(this.dateTime).getTime() / 1000 - (new Date() / 1000 | 0)
            if (endTime <= 0) {
                clearInterval(this.interval)
                this.countdownShow = false
                this.$emit('countdownClose');
            }
            let date = {
                day: Math.floor(endTime / 86400),
                hour: Math.floor(endTime % 86400 / 3600),
                minute: Math.floor(endTime % 3600 / 60),
                second: Math.floor(endTime % 3600 % 60)
            }

            Object.keys(date).forEach(value => {
                if (date[value].toString().length < 2 && value !== 'day') {
                    this.pageData[value] = "0" + date[value]
                } else {
                    this.pageData[value] = date[value]
                }
            })
        }
    }
}
</script>