prop를 지정해주고 컴포넌트에서 적용하는 방법
1번째 방법
function Food(prpos) {
return <h1>i like {props.fav}</h1>
}
function App() {
return (
<div>
<h1>hello</h1>
<Food fav = "kimchi" />
</div>
)
}
2번째 방법
function Food({fav}) { // 오브젝트의 특정 속성값만 가져오기
return <h1>i like {fav}</h1>
}
function App() {
return (
<div>
<h1>hello</h1>
<Food fav = "kimchi" />
</div>
)
}
동적으로 component 다루기
별도의 api를 내가 가져왔다고 가정하고 가상의 api를 내가 직접 배열로 만들어서 해당 값들을 불러오는걸 연습해보자.
javascript에서 배웠던 것을 그대로 기반으로 해서 생각보다 쉽다는 것을 알 수 있다.
리액트의 편리함에 대해 점점 더 채감하고 있는 것 같다.
댓글