一,文字類指令相互繫結的兩種方式:1,繫結的變數是一樣的,2,插值表示式中的變數值和繫結的變數一致
v-text:文字格式,原文本會被替換
v-html:可以解析帶html標籤的文字資訊
v-once:文字只能被賦值一次
這是p
}原文本}
二,避免閃爍在vue更改html中的值得時候,重新整理的快會產生閃爍的現象
兩種方式1,把vue的原始檔直接匯入到html檔案的開始
2,在需要更改的div裡面加入v-cloak屬性,在css中利用屬性查詢,查詢到以後display:none
三,v-bind指令1,該指令繫結的是屬性(html標籤的全域性屬性)
2,繫結之後的屬性的屬性值可以由變數控制
哀其不幸,怒其不爭。
不滿足是向上的齒輪。
渡盡劫波兄弟在,相逢一笑泯恩仇。
躲進小樓成一統,管它冬夏與春秋。
橫眉冷對千夫指,俯首甘為孺子牛。
改造自己,總比禁止別人來得難。
單是說不行,要緊的是做.
簡寫
四 v-on指令(簡寫@)後面繫結的是事件,直接操作的是方法名
五,v-model指令資料的雙向繫結:v-model繫結的是value,所以可以省略
(也就是把輸入的值全部賦值給v-model繫結的值,必須在vue中給賦值"")
籃球足球桌球
男:女:
提交
六,條件渲染:1,條件渲染的值為true|false
2,true代表標籤顯示方式渲染
3,false v-if不渲染到頁面,v-show以display:none渲染到頁面,但是不會顯示
012...
......
七,列表渲染1,一般列表渲染需要建立快取,需要使用變數key,而使用變數key必須使用v-bind繫結2,v-for變數陣列時,接收兩個值時,第乙個為元素值,第二個值為元素的索引
3,v-for接收三個值時(並且接受的是個字典時),用(元素值,元素鍵,元素的索引)
} }
八,todolist案例
vue的相關指令
插槽表示式閃爍問題 事件修飾符 1 click.stop 表示式 函式名 阻止事件冒泡,只執行自身事件不傳遞事件 寫在自身事件上 2 click.prevent 表示式 函式名 阻止預設行為,不響應預設事件 寫在自身事件上 3 click.captuer 表示式 函式名 捕獲事件,先走自身事件在走其...
Vue框架 Vue指令
v cloak 避免螢幕閃爍 class屬性 重點 style屬性 了解 案例 123 data methods 12 3 事件處理 3 v if有家族 v if v else if v else if控制顯隱 你是第1個p 你是第2個p 你是第3個p 案例綠 藍 注意 v for遍歷要依賴於乙個所...
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...