vue模板語法(二)
樣式繫結
class繫結
使用方式：v-bind:class="expression"
expression的型別：字串、陣列、物件
1.2 style繫結
v-bind:style="expression"
expression的型別：字串、陣列、物件
12322
2332
333444
事件處理器
事件監聽可以使用v-on 指令
事件修飾符
vue通過由點(.)表示的指令字尾來呼叫修飾符，
.stop
.prevent
.capture
.self
.once
...
...
按鍵修飾符
vue允許為v-on在監聽鍵盤事件時新增按鍵修飾符：
vue為最常用的按鍵提供了別名
全部的按鍵別名：
.enter
.tab
.delete (捕獲 "刪除" 和 "退格" 鍵)
.esc
.space
.up.down
.left
.right
.ctrl
.alt
.shift
.meta
12322
2370
7172122
vue表單
用v-model指令在表單控制項元素上建立雙向資料繫結
常用控制項
文字框/密碼框/文字域/隱藏域
單選核取方塊/多選核取方塊
單選按鈕
下拉框修飾符
.lazy
預設情況下， v-model在input事件中同步輸入框的值與資料，但你可以新增乙個修飾符lazy，從而轉變為在change事件中同步
.number
將使用者的輸入值轉為 number 型別
.trim
自動過濾使用者輸入的首尾空格
12389113637
3896
vue元件
元件簡介
元件(component)是vue最強大的功能之一
元件可以擴充套件html元素，封裝可重用的**
元件系統讓我們可以用獨立可復用的小組件來構建大型應用，幾乎任意型別的應用的介面都可以抽象為乙個元件樹
全域性和區域性元件
全域性元件：vue.component(tagname, options)，tagname為元件名，options為配置選項。
區域性元件: new vue(})
註冊後，我們可以使用以下方式來呼叫元件：
props
props是父元件用來傳遞資料的乙個自定義屬性。
父元件的資料需要通過props把資料傳給子元件，子元件需要顯式地用props選項宣告 "prop"
監聽事件：$on(eventname)
觸發事件：$emit(eventname)
vue自定義事件是為元件間通訊設計
vue中父元件通過prop傳遞資料給子元件，而想要將子元件的資料傳遞給父元件，則可以通過自定義事件的繫結
父vue例項->vue例項，通過prop傳遞資料
子vue例項->父vue例項，通過事件傳遞資料
事件名不同於元件和prop，事件名不存在任何自動化的大小寫轉換。而是觸發的事件名需要完全匹配監聽這個事件所用的名稱
建議使用「短橫線分隔命名」，例如：three-click
1238930313283
Vue基礎 三 模板語法 二
vue是通過指令v on來繫結事件的，例如最常用的點選方法 v on click。我們也可以縮寫為 click 來個簡單的案例 點選點選1 點選2點選3 執行的效果 可以看到，四種寫法都可以實現點選事件的繫結，並且this指向的是vue的例項物件。前面兩個方案能將num值改變，但是我們不推薦這麼寫，...
VUE 模板語法
message span 雙大括號裡面的內容會被替換成msg的變數值，在msg變數值改變的時候會自動更新html裡的內容 只輸出純文字文字，不會有html效果，為了輸出html需要用到v html指令 using mustaches p using v html directive v html r...
Vue模板語法
插值v html指令 我們可以在js裡自定義html 屬性v bind 簡寫 我們可以可以指定標籤的一些屬性給它們賦值，還有v model也是賦值，但是它會影響整個所有它定義的那個資料，而不只是乙個 v bind 與v model的區別 v model是做資料雙向繫結的指令 v bind只是將對應的...