-
카테고리
-
세부 분야
프론트엔드
-
해결 여부
미해결
Row 컴포넌트 생성하기 base_url not defined
22.08.13 11:50 작성 조회수 188
0
안녕하세요 선생님 Row 컴포넌트 생성하기에서
base_url 을 가져오지 못한다는 에러가 나오는데 어떤게 문제인건가요 ?
import React, { useEffect, useState } from 'react'
import axios from "../api/axios"
const Row = ({ title, fetchUrl, id, isLargeRow}) => {
const [movies, setMovies] = useState([])
useEffect(()=> {
fetchMovieData()
},[])
const fetchMovieData = async ()=> {
const request = await axios.get(fetchUrl)
setMovies(request.data.results)
}
return (
<section>
<h2>{title}</h2>
<div className="slider">
<div className="slider__arrow-left">
<span className="arrow">
{"<"}
</span>
</div>
<div id={id} className="row__posters" >
{movies.map((movie) =>(
<img
key={movie.id}
className={`row__poster ${isLargeRow && "row__posterLarge"}`}
src={`${BASE_URL}${isLargeRow ? movie.poster_path : movie.backdrop_path}`}
loading="lazy"
alt={movie.name}
/>
))}
</div>
<div className="slider__arrow-right">
<span className="arrow">
{">"}
</span>
</div>
</div>
</section>
)
}
export default Row
답변을 작성해보세요.
1
성민석
2022.08.13
코드 이렇게 바꿔보시겠어요?
src={`https://image.tmdb.org/t/p/original/${
isLargeRow ? movie.poster_path : movie.backdrop_path
}`}
2021신년다짐
질문자2022.08.13
감사합니다. 근데 base_url 문제는 해결이 되었는데,
movies를 맵 돌릴수 없다고 나오는데, 콘솔로그 다시 확인해보니 request의 data 가 "" 로 찍히더라고요, 혹시 어느 부분을 확인하면 될까요 ??
성민석
2022.08.13
혹시 axios.js랑 requests.js 올려주실수 있을까요?
추가로 Row 프롭스 잘 전달하셨나요?
<Row title="Trending Now" id="TN" fetchUrl={requests.fetchTrending} />
답변 1