Framework & Library/Vue.js

[Vue.js] Vue 인스턴스

gangintheremark 2023. 7. 26. 00:06
728x90

인스턴스는 Vue.js로 화면을 개발하기 위해 필수로 생성해야 하는 코드이다.

Vue 인스턴스 생성자

인스턴스 안에는 미리 정의되어 있는 속성과 메서드(API)들이 있기 때문에 이 기능들을 이용하여 화면을 개발한다.
인스턴스는 아래와 같이 생성할 수 있다.

new Vue ({
    // instance option properties
});

인스턴스의 속성,  API들

new Vue ({
    el: ,
    template: ,
    date: ,
    methods: ,
    created: ,
    watch: ,
});
  • el : 인스턴스가 그려지는 특정 HTML 태그
  • template : 화면에 표시할 요소 (HTML, CSS)
  • data : Vue의 반응성(Reactivity)이 반영된 데이터 속성
  • methods : 화면의 동작과 이벤트 로직을 제어하는 메서드
  • created : Vue의 Lifecycle과 관련된 속성
  • watch : data에서 정의한 속성이 변화되었을 때 추가 동작을 수행할 수 있게하는 속성
💡 Reactivity와 Lifecycle은 나중에 정리 
728x90