Update stanu licznika w komponencie

Update stanu licznika w komponencie
bartek164
  • Rejestracja:prawie 9 lat
  • Ostatnio:ponad rok
  • Postów:534
0

Czemu w tym kodzie po pewnym czasie zaczyna świrować
wchodzi rysuje 0,
potem wykonuje się useEffect() ustawia interval czeka,
interval zmienia state na o jeden większy.
znowu odpala sie useEffect() i ustawia się interval, czemu następują dodatkowe useeffecty?

Kopiuj
import { useEffect, useState } from 'react';

const Counter = () => {
  const [count, setCount] = useState(0);

  useEffect(() => {
    console.log('tutaj');
    setInterval(() => {
      setCount(count + 1);
    }, 5000);
  }, [count]);

  return <div>{count}</div>;
};

export default Counter;
edytowany 1x, ostatnio: Riddle
LukeJL
  • Rejestracja:około 11 lat
  • Ostatnio:około 5 godzin
  • Postów:8423
2

bo nie kasujesz intervalu przez clearInterval, wobec tego efekt ciągle się odpala i interval na nowo, a nigdy nie jest kasowany:
możesz zwrócić funkcję czyszczącą tak jak tutaj napisali: https://reactjs.org/docs/hooks-reference.html#useeffect


edytowany 1x, ostatnio: LukeJL

Zarejestruj się i dołącz do największej społeczności programistów w Polsce.

Otrzymaj wsparcie, dziel się wiedzą i rozwijaj swoje umiejętności z najlepszymi.