[vue.js] Component

Copmponent : 원하는 HTML 덩어리를 한 글자로 축약할 수 있도록 도와주는 문법

코드가 길고 복잡한 건 아니지만 길고 복잡해지면 긴 HTML으 축약하는 컴포넌트 문법을 쓸 수 있다.

Component 만드는 방법

작명.vue 파일으 아무데나 만든 후 축약할 HTML을 붙혀준다.

새로 만든 vue 파일에도 형식이 필요한데, 형식 줄임키는 < + enter 누르면 된다.

Component 쓰는 법

1. 컴포넌트를 만든다.
   

2. vue 파일을 import 한다.
   

3. components : {} 에 등록한다.
   

4. 쓴다.
   

왜 Component 씀?
1. 아름답게 축약됨.
2. 배너같은 반복적인 div 가 있을 때 재사용이 좋음.

주의해야할점
컴포넌트를 만들 때 2단어 이상으로 작명해야 한다. 안그러면 에러납니다.
ex) Discount.vue -> DiscountBanner.vue 이런식으로 만들어야 한단 말이죠.
귀찮음;

"rules": {
   "vue/multi-word-component-names": "off"
} 

pakage.json 에 추가해주면 됩니다.