Question

我尝试构建一个调查，当用户等待时间过长时，倒计时应该每10秒显示一个模态。在显示模态时应停止倒计时，并且在单击“返回调查”按钮以及回答问题后应重新开始倒计时。

我对高山对象尝试过这种方式：

let Countdown = () => {
        return {

                open: false,
                heart:'',
                

                ccdown(time,hue) 
                {
                    time -= 1;
                    hue += 60;

                    if (time > 0) {
                    this.heart=setTimeout(this.ccdown, 500, time, hue);
                    console.log("time: "+ time);
                    console.log("hue: " + hue);
                    
                    }
                    if(time == 0) {

                    console.log("done");
                    this.open = true;
                    }
                }

        }    
}

这是我在刀片组件中调用函数的方式：

<div x-data="Countdown()" x-init="ccdown(10,30)">
...
</div>

但是它在第二次之后停止。有人可以告诉我问题吗？

Answer 1

问题在这里：

setTimeout（this.ccdown，500，time，hue）;

setTimeout仅接受两个参数，即函数和超时。如果必须使用参数调用该函数，则应使用bind或创建一个新函数。所以应该是：

setTimeout(() => {
    this.ccdown(time, hue)
}, 500)

或者，

setTimeout(this.ccdown.bind(this, time, hue), 500)

使用Alpine.js重新开始Livewire的倒计时

1 个答案: