Axios 라이브러리를 활용한 HTTP 요청 부분에 대해 질문드립니다.
안녕하세요. 좋은 강의 잘 듣고 있습니다!
Axios 라이브러리를 활용한 HTTP 요청 부분에 함수형으로 작성해 보았는데요.
api가 달라졌는지 mr-robot은 응답이 없어서 다른 드라마로 했고 객체 하나로 응답을 받았습니다.
코드는 아래와 같습니다.
아래 코드에서 episodeObj와 episodeObj.image 까지는 웹페이지 출력이 잘 되는데요.
주석처리 한 것 처럼 medium을 할당 하거나 episodeObj.image.medium으로 접근하면
Cannot read properties of undefined (reading 'medium')
이런 오류가 발생합니다. 어떻게 해결 할 수 있는지 궁금합니다.
답변 1
1
mr-robot 검색결과가 null이군요. 알려주셔서 감사합니다.
useEffect 수행과 axios.get 요청은 비동기 동작입니다. 그렇기에 23라인~28라인에서 episodeObj 상탯값을 통해 렌더링할 때, axios.get 응답을 받기 전 일 수 있습니다.
axios.get 응답을 받기 전에는 episodeObj 상탯값은 {} 이며, 이때 episodeObj.name과 episodeObj.image는 undefined가 됩니다. 여기까지는 오류가 발생하지 않는 데, episodeObj.image.medium 에서는 undefined인 episodeObj.image를 통해서 medium을 참조했기 때문에 말씀하신 TypeError "Cannot read properties of undefined (reading 'medium')" 예외가 발생하는 것입니다.
객체 비구조화 문법에서는 이 경우를 대응하기 조금 까다롭고, 이는 Optional Chaining 문법을 쓰시면 간결하게 해결하실 수 있습니다.
https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Operators/Optional_chaining
episodeObj.image.medium 대신에 episodeObj.image?.medium 이라고 쓰시는 거죠.
혹은 axios.get 응답 이후에 episodeObj를 활용해서 렌더링이 되도록 플래그를 세팅해서 처리해보실 수도 있습니다.
0
몇 시간 동안 검색해도 해결 못했었는데 ㅠㅠ 간단히 잘 해결 되었습니다!
감사합니다~! 지금까지 들어본 최고의 django 강의입니다!
앞으로도 다른 좋은 강의 많이 부탁드립니다. (음.. FastAPI? 아직 강의가 없더라고요..)
즐겁고 행복한 하루 보내세요.
안녕하세요.
0
62
1
[OneToOne Field Demo] get_user_model() 메서드를 활용해야 하는 이유?
0
282
1
useEffect 훅에서 else 유무에 따른 결과
0
221
1
useAxios 훅의 dependency array 설정
0
254
1
useEffect에서 변수 업데이트 관련 질문
0
388
1
rest_framework.generics.CreateAPIView의 model 속성 유무
0
273
1
bootstrap4
0
479
4
리뉴얼 강의가 오픈이 되면 기존 강의는 더이상 못보는걸까요
1
373
1
admin form에서 앞선 필드 선택 후 다른 필드 select widget 구성하는 방법
0
577
3
useState는 필수일까요?
0
269
1
python manage.py makemigrations instagram 시 created_at default 오류가 발생합니다.
0
606
4
Django allauth를 사용한 소셜 로그인 시 에러
0
657
1
프로젝트명 변경 뒤, 디버그툴바+디버그모드 사용 시 에러
0
561
2
useLocalStorage() 함수 사용여부
0
233
1
django에 LOGIN_URL = '/accounts/login/'의 의미?
0
451
1
리듀서의 의미 재확인
0
435
1
simple-jwt Refresh Token 사용 노하우
0
903
2
docker compose 를 통한 배포 관련 오류 문의
0
683
1
파이썬 속도 장고 관련 궁금한게 있습니다.
0
369
1
is_like_user
0
237
1
related_name 오류
0
276
1
re_path 오류
0
263
1
re_path url
0
252
1
No post matches the given query
0
667
2