Vue常用指令

2021-10-05 08:13:34 字數 1031 閱讀 9578

指令：即vue內部提供的自定義屬性，其封裝了vue內部實現的一些功能。

v-once：介面不跟資料變化，只渲染一次。

v-cloak：資料渲染後自動顯示元素。 [v-cloak]:預設先隱藏未渲染的介面等到生成html渲染之後再重新顯示。

vue資料繫結過程：

1.會先將未繫結資料的介面展示給使用者

2.然後再根據模型中的資料和控制的區域生成繫結資料之後的html**

3最後再將繫結資料之後的html渲染到介面上

v-text：當於innertext

v-html：相當於innerhtml

v-if：條件渲染: 如果v-if取值是true就渲染元素,如果不是就不渲染元素

= 60">良好

差v-show:v-show和v-if的能夠一樣都是條件渲染, 取值為true就顯示, 取值為false就不顯示

v-if和v-show區別

v-for:相當於js中的for in迴圈, 可以根據資料多次渲染元素

陣列：}_}

字串：}_}

數字：}_}

物件：}_}

v-bind:所以v-bind的作用是專門用於給"元素的屬性"繫結資料的

格式一：v-bind:屬性名稱="繫結的資料"


格式二：:屬性名稱="繫結的資料"
v-on:v-on指令專門用於給元素繫結監聽事件

vue監聽事件2


vue監聽事件3
按鍵修飾符：監聽特定按鍵觸發的事件

注意點：113是keycode中按鍵f2的鍵碼值
自定義全域性指令：

vue.directive('自定義指令名稱', 


});
自定義區域性指令：

directives: 


}}

vue常用指令

1 v model id box type text v model br div var a new vue script 就和 ng model 乙個意思了 v html html v html html渲染過程中被解析 v text text 同上 意思就是資料渲染過程中被解析 v for v...

vue常用指令

常用內建指令 v text 更新元素的 textcontent v html 更新元素的 innerhtml v if 如果為true,當前標籤才會輸出到頁面 v else 如果為false,當前標籤才會輸出到頁面 v show 通過控制display樣式來控制顯示 隱藏 v for 遍歷陣列 物件...

vue常用指令

vue常用指令 1.v text v text主要用來更新textcontent，可以等同於js的text屬性 2.v html 雙大括號的方式會將資料解釋為純文字，而非html。為了輸出真正的html，可以用v html指令。它等同於js的innerhtml屬性。3.v pre v pre主要用來...