vue經常使用指令

1.v-text 是元素的innerText只能在雙標籤中使用

v-html是元素的innerhtml，不能包含{{xxx}}

v-if元素是否移除或者插入

v-show元素是否顯示或隱藏

v-model雙向元素綁定，v-bind是單向元素綁定（內存js改變影響頁面）

 

2.class結合v-bind使用

須要根據可變的表達式的結果來給class賦值，就須要用到v-bind:class="xxx"

v-bind:屬性名=「表達式」，最終表達式運算結束的結果賦值給該屬性名

簡化的寫法是：`：屬性名=「表達式」`

class：結果的分類

一個樣式：返回字符串（三元表達式和key和樣式的清單對象）

多個樣式：返回對象（樣式作key,true或false作值）

 

3.methods和v-on的使用

*綁定事件的方法

`v-on：事件名=「表達式||函數名」`

簡寫：`@事件名=「表達式||函數名」`

*函數名若是沒有參數，能夠省略（） 只給一個函數名稱

*聲明組件內函數，在export default這個對象的根屬性加上methods屬性，其是一個對象

key是函數名 值是函數體

*在exports default這個對象的根屬性加上data屬性，其是一個函數，返回一個對象

對象的屬性是咱們初始化的變量的名稱

*凡是在template中使用變量或者函數，不須要加this

*在script中使用就須要加上this

 

3.v-for的使用

能夠使用操做數組：（item，index）

能夠使用操做對象（value,key,index）

 key是相似trank by 的一個屬性，目的是告訴vue，js中的元素，與頁面之間的關聯。當試圖刪除元素時，是單個元素的刪除，而不是所有替換，