인프런 커뮤니티 질문&답변

박수연님의 프로필 이미지
박수연

작성한 질문수

[2024] 한입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지

12.8) 일기 관리 기능 구현하기 1

diaryList 질문

해결된 질문

작성

·

345

0

안녕하세요! 우선 좋은 강의 제공해주셔서 감사해요.
 
다름이 아니라, 강의 영상 28:47 부분과 같이 다이어리 리스트가 화면에 떠야 하는데 뜨지 않는 에러가 발생했고, 스스로 해결이 안 돼서 도움을 요청하려고 글을 쓰게 되었어요.
 
개발자도구 요소 탭에서도 리스트가 뜨지 않더라구요. 코드 마지막 부분 즉 export default DiaryList; 바로 앞 부분에 console.log(diaryList);도 입력해 보았는데 콘솔 창에는 undefined라고 출력이 되었어요.
코딩 공부가 처음이다보니 에러를 해결하기 위해 무엇부터 손을 대야 할 지도 모르겠고 질문조차 어떻게 해야 할 지 모르겠네요..ㅎㅎ
 
javascriptnodejsreact

답변 2

1

wind340님의 프로필 이미지
wind340

ㅠㅠ제 오류찾으며 지나다니던 1인 입니다. 개발자모드에서 component에서 값이 잘 들어있는 지, 잘 넘겨주고있는지 확인해야 할 거 같아요. 올려주신 사진의 코드는 딱히 문제 없어보입니다. 제 사진 첨부 한 것처럼 중간 Home.js 에 데이터가  있다면, home.js에서 데이터를 넘겨주면되구요. home에도 없다면 못받은거니 App.js에서 Provider 벨류에 데이터도 넘겨줬는지 확인해봐야 합니다. 모쪼록 에러없는 하루 되시길 바라요..

박수연님의 프로필 이미지
박수연
질문자

넘넘 감사합니다..!ㅜㅜ 드뎌 해결했어요

0

Anfield님의 프로필 이미지
Anfield

저도 리스트 출력 안 되어서 이런 방식으로 찍었더니 되네요. 똑같은 방식이긴 한데 왜 강의꺼로 하면 안 되는지 모르겠네요.

jjy321501님의 프로필 이미지
jjy321501

저도 뭐가 다른지 계속 보다가 발견했는데요

 

map (( it ) => { ... })가 아닌 map (( it ) => ( ... ))

중괄호 에서 소괄호로 고치니까 diaryList

정상 출력되네요 

yee0230님의 프로필 이미지
yee0230

JSX 에서 {} 를 사용하면 return을 해야합니다. :)
ex)

{diaryList.map((it) => { return <div key={it.id}>{it.content}</div>; })}

 

박수연님의 프로필 이미지
박수연

작성한 질문수

전체 Q&A
질문하기