vue 中常用的指令:基本指令:v-model、v-if、v-for、v-on、v-bind修飾符指令:.lazy、.prevent、.capture、.once條件性渲染指令:v-if、v-else、v-else-if循環(huán)指令:v-for、v-for-in事件處理指令:v-on屬性綁定指令:v-bind
Vue 中常用的指令
Vue 中提供了豐富的指令,用于增強(qiáng)組件和模板的功能。以下列出了一些最常用的指令:
基本指令
v-model:綁定組件數(shù)據(jù)到 HTML 輸入元素。
v-if:根據(jù)條件顯示或隱藏元素。
v-for:遍歷數(shù)組或?qū)ο蟛?chuàng)建重復(fù)元素。
v-on:監(jiān)聽事件并調(diào)用方法。
v-bind:動(dòng)態(tài)綁定屬性值。
修飾符
指令可以搭配修飾符使用,以修改其行為。例如:
.lazy:延遲事件處理。
.prevent:阻止事件的默認(rèn)行為。
.capture:捕獲捕獲階段事件。
.once:事件僅觸發(fā)一次。
條件性渲染指令
這些指令根據(jù)條件渲染元素:
v-if:如果條件為真,渲染元素。
v-else:如果 v-if 條件為假,渲染元素。
v-else-if:如果 v-if 和前面的 v-else-if 條件都為假,渲染元素。
循環(huán)指令
這些指令用于遍歷數(shù)據(jù)并創(chuàng)建重復(fù)元素:
v-for:遍歷數(shù)組或?qū)ο蟛?chuàng)建重復(fù)元素。
v-for-in:遍歷對(duì)象的可枚舉屬性并創(chuàng)建重復(fù)元素。
事件處理指令
這些指令用于監(jiān)聽事件并調(diào)用方法:
v-on:監(jiān)聽事件并調(diào)用方法。
v-on.click:在元素被點(diǎn)擊時(shí)調(diào)用方法。
v-on.keyup:在用戶釋放鍵盤按鍵時(shí)調(diào)用方法。
屬性綁定指令
這些指令用于動(dòng)態(tài)綁定屬性值:
v-bind:動(dòng)態(tài)綁定屬性值。
v-bind:class:動(dòng)態(tài)綁定 CSS 類。
v-bind:style:動(dòng)態(tài)綁定 CSS 樣式。






