props질문입니다.

Question

PhoneInfoList.js에서 < PhoneInfo info = { info } key = { info . id } /> PhoneInfo컴포넌트한테 전달하는데 받을 때 const { name , phone , id } = this . props . info ; this.props.info로 받는건 알겠습니다. 그런데 App.js에서 PhoneInfoList로 전달할때 < PhoneInfoList data = {this . state . information } > data=어쩌고 보내니까 PhoneInfoList에서 const { data } = this . props.data;로 받아야하는 줄 알고 그렇게 작성했더니 에러가 났습니다. this.props; 로 하면 되고 this.props.data로 하면 에러가 나는데 개념이 아직 안되어있는건지는 모르겠는데 설명해주실 수 있나요 ㅠ

HHS · Answer

지나가던 수강생입니다만 댓글 달아드립니다.   this.props.data 가 있잖아요~ 이 말은, 맨윗층이 this, 그아랫층이 props, 그아래아랫층이 data 이라는 것입니다.   일반화해서 써보면, const { 아래아랫층 } = 맨윗층.그아랫층; 이 되어야 문법이 맞습니다.   const { 아랫층 } = 맨윗층; 이렇게 쓰신 뒤, 나중에 활용하실 때 아랫층.아래아랫층 이렇게 쓰셔도 되구요.   무슨 원리나면, 등호 오른쪽에 있는 객체 내부에서, 등호 왼쪽에 있는 객체 이름과 같은 이름의 객체를 찾아 불러온다는 의미입니다. 따라서 항상 등호 왼쪽보다 오른쪽이 한층 위의 객체여야 합니다.

rhaehl2116 · Answer

감사합니다👍👍!!