Vue.js의 핵심은 간단한 템플릿 구문을 사용해 선언적으로 DOM에 데이터를 렌더링하는 것
데이터와 DOM이 연결되어 이제 모든 것이 반응형이다.
DOM : 브라우저의 JavaScript 콘솔에서 보여주는 것들
- 예) HTML 작성시
<table>
안에<tbody>
없이<tr>,<th>
를 사용한 경우, 개발자 도구에는<tbody>
가 존재 <tbody>
는 DOM에 있다.
선언적 렌더링
v-bind
: 렌더링 된 DOM에 특수한 반응형 동작
조건문과 반복문
v-if : 조건
v-for : 반복
사용자 입력 핸들링
v-on
디렉티브 : 상호 작용, 특히 DOM을 직접 건드리지 않고 Vue에 의해 처리되고 업데이트
v-model
디렉티브 : 양식에 대한 입력과 앱 상태를 양방향으로 바인딩
컴포넌트를 사용한 작성방법
Vue에서, 컴포넌트는 본질적으로 미리 정의된 옵션을 가진 Vue 인스턴스.
대규모 응용 프로그램에서는 개발 과정을 관리할 수 있는 수준 하에 두기 위해 전체 앱을 컴포넌트로 나누는 것이 필수적이다.
'Vue.js' 카테고리의 다른 글
Computed와 Watch (0) | 2019.01.08 |
---|---|
SPA(Single Page Application) (0) | 2019.01.06 |
템플릿 문법 (0) | 2019.01.06 |
Vue 인스턴스 (0) | 2019.01.06 |
Vue CLI 로 Webpack Simple 프로젝트 생성 (1) | 2019.01.02 |