使用 Svelte 进行倒计时冻结答案

【问题标题】：Countdown Freeze using Svelte使用 Svelte 进行倒计时冻结
【发布时间】：2021-03-22 17:27:02
【问题描述】：

我正在尝试使用 Svelte 创建倒计时。但不知何故，输出不是动态的，在我刷新页面之前它不会改变，然后值会改变。我的代码中可能存在逻辑错误。有什么可以开始的吗？还是只是 svelte 的编译器一直在窃听？谢谢

    import { tweened } from 'svelte/motion';
    var expected = new Date("Feb 5, 2021 15:37:25").getTime();
    var now = new Date().getTime();
    let distance = tweened(expected-now);

    setInterval(()=> {
        if ($distance > 0){
            $distance-=1;
        }
    },1000)
  $: days = Math.floor($distance / (1000 * 60 * 60 * 24));
  $: hours = Math.floor(($distance % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
  $: minutes = Math.floor(($distance % (1000 * 60 * 60)) / (1000 * 60));
  $: seconds = Math.floor(($distance % (1000 * 60)) / 1000);

【问题讨论】：

标签： javascript svelte svelte-component

【解决方案1】：

您的代码存在逻辑问题 - 您只是每秒从 distance 中减去 1 毫秒，而不是 1000 毫秒（1 秒）。

如果您将代码更新为一次减去 1000 毫秒而不是 1，则倒计时将按预期工作。

setInterval(()=> {
    if ($distance > 0){
        $distance -= 1000;
    }
}, 1000)

【讨论】：