map으로 반복되는 JSX 찍어내기 설명
대충 props.days가 ["SUN", "MON", "TUE", "WED", "THU", "FRI", "SAT"]라고 하면
function example({days}) {
return (
<div>
<h1>{day[0]}</h1>
<h1>{day[1]}</h1>
<h1>{day[2]}</h1>
<h1>{day[3]}</h1>
<h1>{day[4]}</h1>
<h1>{day[5]}</h1>
<h1>{day[6]}</h1>
</div>
);
}
//map으로 반복
function example ({days}) {
return (
<div>
days.map((day) => {
return <h1 key={day}>{day}</h1>;
});
</div>
);
}
map을 통해 반복되는 부분은 찍어낼 수 있다!
단 반복되는 JSX에 꼭 Key를 넣어야한다.