문제해결_ 코드가 길어지면 props도 헷갈린다.( 객체구조분해할당 )

 

 

 

• 홈화면에서 메인화면으로 입장하면 현재 추천 지역이 상단 문구에 뜨고, 해당 지역의 미세먼지 추세 그래프가 뜬다.
• 페이지별로 화면을 구성하는 것은 리액트의 장점을 못살리는 UI라고 생각했다. 메인화면 내부의 컴포넌트를 바꿔주는 형식으로 디자인을 구성했는데, 필터도 필요하고 다이어리(기록)부분으로 컴포넌트를 바꿀때 상단의 필터를 어떻게 처리해줘야 효율적일지 고민했다. 단순하게 페이지별로 나누고싶은 욕구가 들었다.

 

 

• 차트 컴포넌트와 기록 컴포넌트를 감싸는 상위 컴포넌트인 메인뷰에는 지역 셀렉트박스(필터)가 있는데, 홈에서 메인으로 넘어올 경우 현재 추천 지역을 디폴트 값으로 넣어주고, 해당지역의 미세먼지 추세를 그래프로 보여준다.
• 필터의 지역은 props로 하위 차트 컴포넌트와 기록 컴포넌트에도 전달을 해주는데 동일한 방법으로 주어도 각각의 컴포넌트에서 받아오는 값의 형태가 달랐다.