Component 2

[Vue] 11. Router & Component1 : Component파일 분리하기

이전글 2022.05.13 - [웹프로그래밍/Vue] - [Vue] 10. Vue Router 기초 [Vue] 10. Vue Router 기초 1. Vue Router란? Single Page Application(SPA)를 구현하려면, 한 페이지에서 Component들만 교체해주면 된다. /a => /b로 변환될 때, router를 통해 전체 화면을 구성하는 Component를 바꿈으로써 페이지 이동을.. yerinpy73.tistory.com 이전글의 코드를 보면 테스트를 위해 한 component의 template을 짧게 작성하였다. 하지만 상용소스는 이보다 훨씬 길기 때문에, 한 파일에 모든 component를 작성한다면 복잡해진다. 각 Component마다 하나의 파일로 분리해서 작성해보자. 1..

Programming/Vue 2022.05.13

[Vue] 06. Component의 개념과 기본 사용법

1. Component란? 화면의 구성 요소들을 블록처럼 분리해서 정의한 후, 한 화면을 만들 때 필요한 요소들을 붙여넣기 위해 사용된다. 이때 블럭에 해당하는 것이 Component이다. Vue Component는 Vue Instance이므로 이에 해당하는 속성들과 Life Cycle Hook 모두 사용 가능하다. *단, data는 함수 형식으로 작성해야 한다. data(){ return{ msg:"지역 컴포넌트!", } } Component 명명 방식 1. Component 이름 = 파스칼(MyComp) | 케밥(my-comp) 2. Component 사용할 때, 태그 명 = 케밥(my-comp) *Component이름을 파스칼형식으로 작성할 경우, 대문자를 기준으로 잘라 케밥으로 전환하여 태그명이 ..

Programming/Vue 2022.05.12