Почему мой компонент бесконечно перерисовывается при использовании useState внутри setTimeout? ⇐ Javascript

[Anonymous]

Я создаю компонент живых часов в React, используя useState и setTimeout. Цель состоит в том, чтобы обновлять время каждую секунду. Однако как только компонент монтируется, он запускает бесконечные повторные рендеринги и в конечном итоге приводит к сбою вкладки.
import React, { useState } from 'react';

function LiveClock() {
const [time, setTime] = useState(new Date().toLocaleTimeString());

setTimeout(() => {
setTime(new Date().toLocaleTimeString());
}, 1000);

return Current Time: {time};
}

export default LiveClock;


Подробнее здесь: https://stackoverflow.com/questions/798 ... a-settimeo