[React] TypeError: Cannot read property '0' of undefined 에러
props가 array 임에도 불구하고 에러 발생!
JSON으로 받아온 값을 하위 컴포넌트에 props로 넘겼는데, 하위 컴포넌트에서 data[0]
로 접근하려 하니 오류가 뜬다.
정확하게는 상위 컴포넌트에서 map으로 하위 컴포넌트를 뿌리는 상황이었다.
여기 저기 검색해보니 처음 mount 될 때는 undefined인 상태에서 [0]으로 접근하기 때문에 발생하는 문제인 것 같았다.
따라서 바로 접근하지 않고 검증을 한 뒤에 접근하도록 하자!
useEffect(() => {
// componentDidMount
setPhoto(props.photo);
if(photo.data && photo.data.length > 0) {
console.log(photo.data[0]);
}
})
data가 존재하고 그 길이가 0 이상일 때만 접근하도록 하니 에러가 사라졌다!
props로 받아오는 데이터의 경우 이렇게 검증을 먼저 한 후에 사용하도록 하자.
# 카테고리
- BOJ 36
- Algorithm 12
- CodingTest 11
- Web 9
- Javascript 8
- Vue 7
- React 7
- DBProject 4
- Python 3
- Tech-interview 3
- Express 3
- Next 3
- Github 2
- Django 2
- C 1
- C++ 1
- WebGame 1