Почему получаю undefined через Апи ? В чем ошибка?
я получаю некие данные через АПИ, пример:
{
"adult": false,
"backdrop_path": "/p1F51Lvj3sMopG948F5HsBbl43C.j
"belongs_to_collection": {
"id": 131296,
"name": "Thor Collection",
"poster_path": "/yw7gr7DhHHVTLlO8Se8uH17TDMA.j
"backdrop_path": "/3KL8UNKFWgIKXzLHjwY0uwgjzYl
},
"budget": 250000000,
"genres": [
{ "id": 28, "name": "Action" },
{ "id": 12, "name": "Adventure" },
{ "id": 14, "name": "Fantasy" }
],
"homepage": "https://www.marvel.com/movies/thor-
"id": 616037,
"imdb_id": "tt10648342",
"original_language": "en",
"original_title": "Thor: Love and Thunder",
"overview": "After his retirement is interrupted
"popularity": 10909.273,
"poster_path": "/pIkRyD18kl4FhoCNQuWxWu5cBLM.jpg
"production_companies": [
{
"id": 420,
"logo_path": "/hUzeosd33nzE5MCNsZxCGEKTXaQ.p
"name": "Marvel Studios",
"origin_country": "US"
},
{
"id": 176762,
"logo_path": null,
"name": "Kevin Feige Productions",
"origin_country": "US"
}
],
"production_countries": [
{ "iso_3166_1": "US", "name": "United States o
],
"release_date": "2022-07-06",
"revenue": 698864051,
"runtime": 119,
"spoken_languages": [
{ "english_name": "English", "iso_639_1": "en"
],
"status": "Released",
"tagline": "The one is not the only.",
"title": "Thor: Love and Thunder",
"video": false,
"vote_average": 6.768,
"vote_count": 1740
}
Далее я прописываю интерфейс к этим данным:
export interface MovieInfo
adult: boolean;
backdrop_path: string;
belongs_to_collection: Be
budget: number;
genres: Genres[];
homepage: string;
id: number;
imdb_id: string;
orignal_language: string;
original_title: string;
overview: string;
popularity: number;
poster_path: string;
production_companies: Pro
production_countries: Pro
release_date: string;
revenue: number;
runtime: number;
spoken_languages: SpokenL
status: string;
tagline: string;
title: string;
video: boolean;
vote_average: number;
vote_count: number;
}
interface BelToCol {
id: number;
name: string;
poster_path: string;
backdrop_path: string;
}
interface Genres {
id: number;
name: string;
}
interface ProdCompany {
id: number;
logo_path: string;
name: string;
origin_country: string;
}
interface ProdCountries {
iso_3166_1: string;
name: string;
}
interface SpokenLan {
english_name: string;
iso_639_1: string;
name: string;
}
И в своем реакт компоненте уже получаю undefined по моему запросу, мой реакт компонент:
import React from "react";
import "./Movie.scss";
import { useParams } from "react-router-dom";
import { MovieInfo } from "../../dataTypes";
export default function Movie() {
const [currentMovieDetail, setMovieDetail] = React.useState<MovieInfo[]>([]);
const { id } = useParams();
React.useEffect(() => {
getData();
window.scrollTo(0, 0);
}, []);
const getData = () => {
fetch(
`https://api.themoviedb.org/3/movie/616037?api_key=4e44d9029b1270a757cddc766a1bcb63&language=en-US`
)
.then((res) => res.json())
.then((data) => setMovieDetail(data.results));
console.log(currentMovieDetail);
};
return <div className="movie"></div>;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/16.6.3/umd/react.production.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react-dom/16.6.3/umd/react-dom.production.min.js"></script>