Vue.js 컴포넌트

1. HTML 길어지면 컴포넌트화해서 사용하면 좋음

2. 컴포넌트 가져다 쓰는 3 Step
    1) import

import Discount from './components/Discount.vue';

    2) 등록

export default {
  name: "App",
  data() {
    return {
    };
  },
  components: {
    Discount, // Discount : Discount 로 해도 됨
  },
};

    3) 사용
        <template> 태그 안에서 <Discount/> 사용

3. 컴포넌트 쓰는 이유
    1) 가독성이 좋음
    2) 재사용이 쉬움

4. 컴포넌트는 자주 반복되는 애들만 만들자
    컴포넌트를 너무 많이 쓰면 데이터 넣을 때 좀 힘듦..

5. 컴포넌트 사용시 데이터를 넘겨줘야하는 부분은 데이터를 props로 전달해주자
    props는 부모가 가진 데이터를 자식이 쓸 수 있게 해줌.

 

6. 컴포넌트를 쓸 타이밍
    1) 다른 곳에서도 쓸 것 같을 때
    2) 라우터로 페이지 나눌 때
    3) HTML이 너무 길어서 복잡할 때