Sobes.tech
Junior — Senior
44

Передача текущего счётчика в аналитику при размонтировании компонента

Task condition

Необходимо реализовать отправку текущего значения счётчика в систему аналитики в момент, когда компонент будет удалён из DOM. При этом следует обеспечить: ‑ сохранение актуального значения счётчика в момент unmount; ‑ отсутствие лишних вызовов отправки при каждом ререндере или клике.

function Component(props) {
  const [count, setCount] = useState(0);

  const onIncrement = () => {
    setCount(s => s + 1);
  };

  useEffect(() => {
    // отправка count при unmount
    return () => {
      // analyticsService.send(count)
    };
  }, []);

  if (count % 2 === 0) {
    return <MyButton handleClick={onIncrement} />;
  }

  return (
    <>
      <div>{count}</div>
      <MyButton handleClick={onIncrement} />
    </>
  );
}