Назад к задачам
Junior — Senior
5

Обнаружить и исправить баги в React‑компоненте

Получайте помощь с лайвкодингом в реальном времени с Sobes Copilot
Условие задачи

В этом фрагменте React‑приложения присутствуют несколько синтаксических и логических ошибок. Требуется их выявить и поправить, чтобы приложение корректно отображалось и правильно реагировало на скролл.

import React, { useState, useEffect, StrictMode } from 'react';
import { createRoot } from "react-dom/client";

const fetchRandomNumber = () =>
  Math.random() < 0.5
    ? Promise.resolve(Math.random())
    : Promise.reject(new Error('Oшибка запроса.'));

const App = () => {
  const [randomNum, setRandomNum] = useState();
  const [scrollPos, setScrollPos] = useState();
  useEffect(initEffect => {
    setRandomNum(await fetchRandomNumber());
    window.addEventListener('scroll', () => setScrollPos(window.scroll()));
    return () =>
      window.removeEventListener('scroll', () => setScrollPos(window.scroll()));
  });
  return (
    <div>
      <div> Number: {randomNum} </div>
      <div> Scroll: {scrollPos} </div>
    </div>
  );
};

const rootElement = document.getElementById("root");
const root = createRoot(rootElement);

root.render(
  <StrictMode>
    <App />
  </StrictMode>
);