[Vue.js] 인스턴스

뷰 인스턴스

인스턴스는 뷰로 개발할 때 필수로 생성해야하는 코드, 단위이다.

 

특징

인스턴스를 생성하면 기본적으로 Root 컴포넌트가 된다.

생성자 함수

자바스크립트에서 함수를 이용하여 인스턴스를 생성하는 방법으로는 생성자 함수가 있다.

 

예제

참고

MDN 생성자 함수 사용하기 예제

Using a Constructor Function

MDN Prototype 설명

Object.prototype.constructor

인스턴스 옵션 속성

new Vue({
  el: ,
  template: ,
  data: ,
  methods: ,
  created: ,
  watch: ,
});

• el : 인스턴스가 그려지는 화면의 시작점 (특정 HTML 태그)
• template : 화면에 표시할 요소 (HTML, CSS 등)
• data : 뷰의 반응성(Reactivity)가 반영된 데이터 속성
• methods : 화면의 동작과 이벤트 로직을 제어하는 메서드
• created : 뷰의 라이프 사이클과 관련된 속성
• watch : data에서 정의한 속성이 변화했을 때 추가 동작을 수행할 수 있게 정의하는 속성