Published 2021. 1. 27. 20:32
728x90
반응형

컴포넌트란

컴포넌트는 Vue의 가장 강력한 기능 중 하나

기본 HTML 엘리먼트를 확장하여 재사용 가능한 코드를 캡슐화하는 데 도움이 됨

상위 수준에서 컴포넌트는 Vue의 컴파일러에 의해 동작이 추가된 사용자 지정 엘리먼트

경우에 따라 특별한 is 속성으로 확장 된 원시 HTML 엘리먼트로 나타날 수도 있음

Vue 컴포넌트는 Vue 인스턴스이기도 함

그러므로 모든 옵션 객체를 사용할 수 있음 (루트에만 사용하는 옵션은 제외)

그리고 같은 라이프사이클 훅을 사용할 수 있음

 

 


 

컴포넌트 작성

컴포넌트는 부모-자식 관계에서 가장 일반적으로 함께 사용하기 위한 것임

컴포넌트 A는 자체 템플릿에서 컴포넌트 B를 사용할 수 있음

그들은 필연적으로 서로 의사 소통이 필요함

부모는 자식에게 데이터를 전달해야 할 수도 있으며, 자식은 자신에게 일어난 일을 부모에게 알릴 필요가 있음

그러나 부모와 자식이 명확하게 정의된 인터페이스를 통해 가능한한 분리된 상태로 유지하는 것도 매우 중요함

이렇게하면 각 컴포넌트의 코드를 상대적으로 격리 할 수 있도록 작성하고 추론할 수 있으므로 유지 관리가 쉽고 잠재적으로 쉽게 재사용 할 수 있음

Vue.js에서 부모-자식 컴포넌트 관계는 props는 아래로, events 위로 라고 요약 할 수 있음

부모는 props를 통해 자식에게 데이터를 전달하고 자식은 events를 통해 부모에게 메시지를 보냄

 

 

반응형

'프로그래밍 > Vue' 카테고리의 다른 글

인스턴스  (0) 2021.02.04
Props02  (0) 2021.02.01
Props01  (0) 2021.01.29
컴포넌트 사용하기  (0) 2021.01.28
Vue  (0) 2021.01.26
복사했습니다!