리액트에서 props로 받을땐 title="123" body="456"
이런식으로 가져왔으면 컴포넌트에서 {props.title} {props.body} 이런식으로 내용을 가져와 사용할 수 있다.
상위 컴포넌트에서 배열을 만든 후 그 변수를 props로 가져와 새로운 배열을 만들어준 후
for문이나 map으로 내용을 입력 할 수 있다
예)
// 새로운 배열 생성
const lis = [];
// map을 이용해 새로운 배열에 기존 배열에 있던 title을 가져와 순서대로 li, a안에 생성
// key에 id도 필수로 가져와야함
props.topics.map(function (item) {
lis.push(<li key={item.id}><a href={"/read/" + item.id}>{item.title}</a></li>);
});
// 배열을 태그안에 하나씩 출력
return (
<nav>
<ol>{lis}</ol>
</nav>
);
리액트에서 props로 받을땐 title="123" body="456"
이런식으로 가져왔으면 컴포넌트에서 {props.title} {props.body} 이런식으로 내용을 가져와 사용할 수 있다.
상위 컴포넌트에서 배열을 만든 후 그 변수를 props로 가져와 새로운 배열을 만들어준 후
for문이나 map으로 내용을 입력 할 수 있다
예)
// 새로운 배열 생성
const lis = [];
// map을 이용해 새로운 배열에 기존 배열에 있던 title을 가져와 순서대로 li, a안에 생성
// key에 id도 필수로 가져와야함
props.topics.map(function (item) {
lis.push(<li key={item.id}><a href={"/read/" + item.id}>{item.title}</a></li>);
});
// 배열을 태그안에 하나씩 출력
return (
<nav>
<ol>{lis}</ol>
</nav>
);
