+src:source code +main.js =>file goc +app.vue =>component goc +Component: +3 thanh phan: +Template:html=> hien thi +Script:js=> xu li style:css=>lam dep +Ho tro scss +scope style:style danh rieng cho component +Root element: +2 ways binding: +bind du lieu 2 chieu +phu thuoc vao kieu cua element +lifecycle:vong doi cua component trong vue. +Binding: +value binding:{{}} +property binding: +V-bind:[Ten thuoc tinh]="bien" +Viet tat:dau 2 cham +style and class binding: :class +model: +lien ket element voi property +Event var vm = new vue({ }) v-bind + <a v-bind:href="url">...</a> or <a :href="url"> ... </a> v-on <a v-on:click="doSomething"> ... </a> or <a @click="doSomething"> ... </a> <div v-bind:class="{ active: isActive }"></div> active sẽ được áp dụng tùy theo tính đúng sai của thuộc tính dữ liệu isActive