import { useState, useEffect } from 'react'; import { Link } from 'react-router-dom'; import movieApi from '../apis/movie.api.js' import Video from '../components/Video.js' const MoviePage = ({ location }) => { const [movieInfo, setMovieInfo] = useState({ ...location.state, stillCuts: [], cast: "", director: "", // genres: [], attendance: "" }) const [state, setState] = useState(0) useEffect(() => { getImagesAndCredits() }, []) async function getImagesAndCredits() { try { const images = await movieApi.getImagesfromTM(movieInfo.id) const still = images.backdrops.map(el => el.file_path) const credits = await movieApi.getCreditsfromTM(movieInfo.id) const castsInfo = credits.cast.map(el => el.name) const casts = castsInfo.reduce((acc, cur, idx) => { if (idx !== 0) return acc + ', ' + cur else return acc + cur }, "") console.log(castsInfo) const directorsInfo = await credits.crew.filter(element => element.job === "Director") const directors = directorsInfo.reduce((acc, cur, idx) => { if (idx !== 0) return acc + ', ' + cur.name else return acc + cur.name }, "") console.log("directorInfo=", directorsInfo) setMovieInfo({ ...movieInfo, stillCuts: still, cast: casts, director: directors }) } catch (error) { console.log(error) } } return (
{console.log(movieInfo)}
{movieInfo.stillCuts.length > 0 ? movieInfo.stillCuts.map((imageUrl, index) => (
스틸컷
)) :
{console.log("스틸컷 불러오기 오류")} 등록된 스틸컷이 없습니다.
}
영화포스터

{movieInfo.title}

예매율: 0% 누적관객수: {movieInfo.attendance}명

감독: {movieInfo.director}

출연: {movieInfo.cast}

장르: {movieInfo.genres.reduce((acc, cur, idx) => { if (idx !== 0) return acc + ', ' + cur.name else return acc + cur.name }, "")}

개봉일:{movieInfo.release_date}

{movieInfo.overview}
관람평
) } export default MoviePage