Component

2022. 10. 10. 22:40React

Component를 쓰는 이유 ? 

  • 반복해서 나오는 Html 덩어리 들을 Component화 하면 좋다.
  • 내용이 매우 자주 변경될 것 같은 HTML 부분을 잘라서 Component로 만들면 좋다.
  • 다른 페이지를 만들고 싶다면 그 페이지의 HTML 내용을 하나의 Component로 만드는게 좋다.
  • 협업할 때 웹페이지를 Component 단위로 나눠서 작업을 분배하기도 한다. 

위 사항은 함수를 쓰는 이유와 같다. 반복, 자주 변경될 것 같은 등 Component가 함수의 문법을 사용하듯 용도 역시 마찬가지다.

Component문법은 복잡한 html을 한 단어로 치환할 수 있다.

<div className="modal">
  <h4>제목</h4>
  <p>날짜</p>
  <p>상세내용</p>
</div>
function App (){
  return (
    <div>
      (생략)
      <Modal></Modal> //이런식으로 사용하기
    </div>
  )
}


function Modal() {
  return (
    <div className="modal">
      <h4>제목</h4>
      <p>날짜</p>
      <p>상세내용</p>
    </div>
  )
}

 

'React' 카테고리의 다른 글

Lazy import  (0) 2022.11.09
useState  (0) 2022.10.10