UseEffect вызывается безусловно на верхнем уровне, а проверка isBest находится внутри callback. В зависимости включают isBest; при выключении отменяют или игнорируют прошлую загрузку.
Как включать загрузку лучших книг по флагу isBest?
UseEffect вызывается безусловно на верхнем уровне, а проверка isBest находится внутри callback. В зависимости включают isBest; при выключении отменяют или игнорируют прошлую загрузку.
Короткий ответ
Что ответить на собеседовании
Подробный разбор
Ответ с пояснениями
Условие
React-компонент Book должен загружать GET /api/books/best только при isBest=true. Сейчас useEffect вызывается внутри if, fetch не проверяет response.ok, результат map не имеет key. Дайте исправление порядка хуков и поведения при смене флага.
Ответ
UseEffect вызывается безусловно на верхнем уровне, а проверка isBest находится внутри callback. В зависимости включают isBest; при выключении отменяют или игнорируют прошлую загрузку.
При isBest=false эффект ничего не загружает и очищает неактуальное состояние по контракту UI. При true создаёт AbortController, проверяет HTTP-статус, разбирает JSON и обновляет результат только для актуального запроса; cleanup выполняет abort. Книги выводят с key по id, загрузку, ошибку и пустой список различают. Inline-стиль сам по себе не функциональная ошибка, а useMemo добавляют по необходимости, не автоматически.
Источник: react.dev.