
倒计时(React)
const endTimestamp = 1750896000000;
function calculateTimeLeft(endTimestamp) {
const difference = endTimestamp - Date.now();
let timeLeft = {
days: 0,
hours: 0,
minutes: 0,
seconds: 0,
};
if (difference > 0) {
timeLeft = {
days: Math.floor(difference / (1000 * 60 * 60 * 24)),
hours: Math.floor((difference / (1000 * 60 * 60)) % 24),
minutes: Math.floor((difference / (1000 * 60)) % 60),
seconds: Math.floor((difference / 1000) % 60),
};
}
return timeLeft;
}
const [timeLeft, setTimeLeft] = useState(calculateTimeLeft(endTimestamp));
useEffect(() => {
const timer = setInterval(() => {
setTimeLeft(calculateTimeLeft(endTimestamp));
}, 1000);
return () => clearInterval(timer);
}, [endTimestamp]);
const padZero = (num) => num.toString().padStart(2, '0');
<div className={styles.times}>
<div>{padZero(timeLeft.days)}</div> : <div>{padZero(timeLeft.hours)}</div> :
<div>{padZero(timeLeft.minutes)}</div> : <div>{padZero(timeLeft.seconds)}</div>
</div>
本文是原创文章,采用 CC BY-NC-ND 4.0 协议,完整转载请注明来自 程序员小鹏
评论
匿名评论
隐私政策
你无需删除空行,直接评论以获取最佳展示效果