✨JSY
article thumbnail
[React] 리스트 동적 처리(ft. map 메소드) / on- prop / 조건 처리
FE/React 2024. 1. 17. 21:39

🔨 컴포넌트의 재사용 React는 component로 이루어져 있고, 데이터만 달라지면서 동일한 컴포넌트를 재사용할 수 있습니다. 아래의 커스텀 컴포넌트 에 MY_HOBBY의 데이터를 각각 다르게 props로 전달하는 코드를 보겠습니다. const MY_HOBBY = [ { title : "Movie", description : "Watch movie at theater", }, { title : "Running", description : "Run 3km", }, { title : "Football", description : "Kick a ball with our team", }, ]; 1. spread operator를 사용하여 배열의 인덱스로 props를 전달합니다. import Hobby fro..