State change in setInterval about van

[Tao-VanJS]

Ah, you should wrap the text inside a binding function. Specifically, change:

p(`Countdown: ${timeout.val}s`)

to

p(() => `Countdown: ${timeout.val}s`)

[Tao-VanJS]

For a state-derived child element, you need to specify a binding function to bind the element with the underlying states. You can refer to this section for more details: https://vanjs.org/tutorial#state-derived-child.

[Tao-VanJS]

You don't need to wrap the setInterval with van.derive. Just simply having the code below will be enough:

const interval = setInterval(() => {
  if (timeout.val === 0) {
    clearInterval(interval);
  }

  --timeout.val;
  console.log(timeout.val)
}, 1000);

[kwameopareasiedu]

I tried this, but the timer keeps getting duplicated and started resulting in multiple countdowns in the console.

[kwameopareasiedu]

This is the code I'm working with.

The thing is the counter in the text, never changes from the initial 5 also, which is weird.

[kwameopareasiedu]

Wow. That actually fixed both issues. Could u please explain why this is?