参考uView倒计时
1、常规操作：自定义倒计时组件 ui-count-down
<template><view class="countdown-view"><u-count-down @change="finishDown" :time="startTimeDown" :startTime="startTime" format="HH:mm:ss"></u-count-down></view>
</template><script>
export default {props: {startTime: {type: [Number, String],default: 0,},},data() {return {startTimeDown: '' //倒计时时间戳}},mounted() {this.intervalTime(this.startTime)},methods: {//日期转时间戳timeProcessing(timeDate) {// let timeDate = "2019-06-24 11:08:48"let Time = new Date(timeDate);// console.log(Time) //Mon Jun 24 2019 11:08:48 GMT+0800 (中国标准时间)let timestemp = Time.getTime();return timestemp},//获取时间差intervalTime(endTime) {// var timestamp=new Date().getTime(); //计算当前时间戳var date1 = (Date.parse(new Date())) / 1000; //计算当前时间戳 (毫秒级)var date2 = (this.timeProcessing(endTime)) / 1000; //1688817600; //计算当前时间戳 (毫秒级)// var date2 = endTime; //结束时间// var date3 = date2.getTime() - date1.getTime(); //时间差的毫秒数var date3 = (date2 - date1) * 1000; //时间差的毫秒数this.startTimeDown = date3//触发当前组件上的 事件，让父类能够监听到this.$emit('countDownTime', date3)return},}}
</script>
<style lang="scss">.countdown-view {margin-left: 10rpx;}
</style>2、引用自定义组件
<ui-count-down @finishDown="finishDown(index)" :startTime="2023-07-17 18:02:00">
</ui-count-down>@finishDown：让父类监听引用组件倒计时的相关操作
//倒计时结束
finishDown(index) {//0:未开播 1:待开播 2:直播中 3:直播结束this.liveList[index].status = 2
}
)
