DaoDao/DaoDaoFrontend/pages/tabbar/tabbar-1/tabbar-1.vue

<template>
	<view class="container">
		<uni-notice-bar show-icon scrollable color="#2979FF" background-color="#EAF2FF"
			text="🌸考研倒计时已经开始，每一天都充满了无限可能！所有的坚持都会换来结果，那些从困境中孕育出的花朵，必将绽放得绚烂。🎯设定目标，制定计划，然后全力以赴！考研的每一步都要走得坚定而有力。相信自己，你有足够的力量战胜一切困难，实现自己的梦想！" />
		
		<uni-card is-full padding>
			<text class="uni-h1">考研倒计时，距离考试还有</text>
			<uni-countdown ref="countdown" :font-size="30" :second="second" :show-colon="false"
				color="#FFFFFF" background-color="#67cfff" />
		</uni-card>


	</view>
</template>

<script>
	export default {
		components: {},
		data() {
			return {
				second: 0,
				targetTimestamp: 1797640200, // 目标日期
			}
		},
		mounted() {
			// 更新时间间隔
			this.updateTimeDifference();
		},
		methods: {
			updateTimeDifference() {
				const now = Math.trunc(Date.now() / 1000); // 当前时间的时间戳
				this.second = this.targetTimestamp - now;
				// console.log(this.second);
			}
		}
	}
</script>

<style>
	.container {
		padding: 20upx;
	}

	.header {
		text-align: center;
		margin-bottom: 20upx;
	}

	.title {
		font-size: 32upx;
		font-weight: bold;
		color: #333;
	}

	.content {
		text-align: center;
	}

	.description {
		font-size: 24upx;
		color: #666;
	}
</style>