[Vue] Vue 인스턴스

 

 

◆ Vue의 특징 

 

- 컴포넌트를 이용한 개발

- 하나의 템플릿을 컴포넌트 형식으로 만들어 여러 곳에서 사용가능

 

 Vue는 화면(view) 라이브러리로 다음과 같은 역할을 가진다.

1. Dom Listeners : DOM을 이용한 조작
2. Data B‭indings : 데이터 바인딩

 

 

뷰의 모든 시작은 뷰 인스턴스를 만드는 것부터 시작된다.
지금부터 Vue 인스턴스에 대해 알아보자!!

 

 

---

 

 

◆ Vue 인스턴스

 

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

- 인스턴스 안에는 뷰에서 제공하는 API(기능)과 속성이 들어있다.

- 인스턴스를 생성하기 위해서는 new Vue() 생성자를 호출해야한다.

 

 

예제에서는 생성자의 속성으로 el, data와 같이 2개만 사용되었으나,

template, methods, created 등 여러 속성이 있으니 아래에서 알아보도록 하자!

 

※ Vue 인스턴스와 생성자함수

- 뷰인스턴스는 생성자함수의 형태로 사용된다.
  생성자함수의 형태와 동일함에 따라 사용효과도 동일하다고 볼 수 있다.

→ 생성자함수 : 매번 함수를 정의하지 않고 미리 정의된 함수를 사용할 수 있다.
→ 뷰 인스턴스 : 뷰에서 API와 속성들을 미리 정의해놓고 재사용할 수 있는 패턴을 가진다.

 

 

---

 

 

◆ 인스턴스의 속성과 옵션

 

- 인스턴스의 속성은 key : value의 형태로 들어간다.

- 객체 표기법으로 객체를 정의하여 new Vue() 생성자의 인자값으로 넣어준다.