Делаю запрос к апи, полученный массив с данными кладется в стэйт. Дальше я пытаюсь в return пройтись по этому массиву map'ом - выдается ошибка map is not a function. Что я делаю не так?
Array.isArray(topFilms) - true, это точно массив.
import React, { useState, useEffect } from 'react';
import axios from 'axios';
import { FilmPreviewCard } from "components/FilmPreviewCard";
const kinopoiskAPI_URL = "https://kinopoiskapiunofficial.tech";
const APItopFilms = "/api/v2.2/films/top?type=TOP_100_POPULAR_FILMS&page=1";
export function TopFilmsPage() {
const [topFilms, setTopFilms] = useState([]);
useEffect(() => {
async function getTopFilms() {
try {
const response = await axios.get(kinopoiskAPI_URL + APItopFilms, {
headers: {
'example': 'example',
}
});
setTopFilms(topFilms.push(response.data.films));
console.log(Array.isArray(topFilms));
} catch (error) {
console.error(error);
}
}
getTopFilms();
}, [])
return (
<div>
{topFilms.map((film, idx) => <FilmPreviewCard
key={idx}
id={film.filmId}
title={film.nameRu}
img={film.posterUrlPreview} />)}
</div>
)
}