nc2u Blog

뷰 인스턴스의 정의와 속성뷰 인스턴스(Instance)는 뷰로 화면을 개발하기 위해 필수적으로 생성해야 하는 기본 단위이다. 뷰 인스턴스 생성 new Vue({ .. }); 뷰 인스턴스를 사용하기 위해 위 코드와 같은 형식으로 뷰 인스턴스를 생성한다. 아래 예제 코드에서 인스턴스와 관계된 부분을 다시 한 번 살펴보자. {{ message }} 먼저 ‘Hello Vue.js!’ 텍스트를 화면에 표시하기 위해 new Vue()로 뷰 인스턴스를 생성하였다. 그리고 인스턴스 안에 el속성으로 뷰 인스턴스가 그려질 지점을 지정하고, data 속성에 message 값을 정의하여 화면의 {{ message }}에 연결하였다. 그럼 각 요소에 대해 자세히 알아보자. 뷰 인스턴스 생성자new Vue()로 인스턴스를 생성..

뷰 템플릿이란?뷰의 템플릿(Template)은 HTML, CSS 등의 마크업 속성과 뷰 인스턴스에서 정의한 데이터 및 로직들을 연결하여 사용자가 브라우저에서 볼 수 있는 형태의 HTML로 변환해 주는 속성이다. 템플릿 속성을 사용하는 방법은 두 가지로, 첫 번째는 ES5에서 뷰 인스턴스의 template 속성을 활용하는 방법이다. 예를 들어 template: Hello {{ message }}와 같은 코드가 템플릿을 의미한다. 여기서 템플릿 속성에 대해 한 가지 알아 둘 특징이 있다. 사용자가 볼 수는 없지만 라이브러리 내부적으로 template 속성에서 정의한 마크업 + 뷰 데이터를 가상 돔 기반의 render()함수로 변환한다. 두 번째는 싱글 파일 컴포넌트 체계의 코드를 활용하는 방법이다. Hell..