2.插值語法
計算屬性
>
>
}h1>
div>
src=
"../js/vue.js"
>
script
>
>
newvue(}
)script
>
幾個常用的options：
data:
methods:
computed:
methods和computed區別：methods是方法，每次呼叫時都會執行方法體，因此呼叫開銷較大。
computed是計算屬性，只有第一次呼叫時會執行方法體計算，再次呼叫時相當於呼叫乙個變數。
這裡的name變數是vue例項中定義的變數，在vue例項掛載的dom中，用}將變數名包起來以顯示變數的內容。這就是mustache語法。
在標籤中加入v-once使標籤內只顯示變數初始定義的值，瀏覽器控制台對變數值的改變不會得到響應。
>
}h2>
v-once
>
}h2>
，而不是形成乙個超鏈。
注意：用了v-text之後，標籤內容就不會再顯示
以上**不會顯示我想加點東西，但是因為前面的v-text指令導致加不了部分
v-pre不使用vue定義的變數，就顯示標籤之間的實際內容，不做任何解析，比如：
網頁就不會再將message變數替換為vue例項中定義的值顯示，而是直接顯示}
正常情況下，如果掛載vue例項的元件中有mustache語句，那麼在未完全載入完成時網頁中會顯示mustache語法的原型（即：}），在相應的標籤中加入v-cloak之後就可以指定顯示的樣式。
>
[v-cloak]
style
>
v-cloak
>
}h2>
}直到message變數解析成相應的字串，但是加了之後就可以為它設定初始樣式，示例中載入階段不會顯示任何東西。
v-bind用來動態的繫結標籤中的屬性，就是將某個屬性和vue例項中的變數繫結到一起，能夠做到變數發生改變時，標籤實時響應。
首先我放乙個vue例項
>
newvue(,
style2:},
methods:
, getclasses:
function()
},getstyles:
function()
}}})
script
>
v-bind:src
:屬性名的形式。
v-bind動態繫結class屬性
物件語法：
其中class繫結的物件中key是類名，value是bool值，value決定了繫結哪個類。
可以用以下**代替陣列語法：
，將過多的物件放到乙個函式中，然後在動態繫結中呼叫
其中class動態繫結了乙個陣列，通過陣列的元素增刪也可以實現動態效果。
當然陣列也可以寫在乙個變數classes中v-bind動態繫結style屬性
這個與class屬性一樣也分為物件語法與陣列語法，不同的是物件語法中style的key:value對應的是style中的各個屬性和值。這裡就不再細說。
前文已經講過計算屬性與函式的差別，這裡談談計算屬性的本質
>
newvue(,
,,]}
, computed:
,totalprice()
return result
}},methods:}}
)script
>
fullname: ,
get: function()
}
這裡由起名字也可以看出還有個區別，習慣上計算屬性是名詞，函式是動詞。
VUE學習總結（一）
1 簡介 vue.js簡單小巧 17kb 漸進式 不必一開始會所有內容，可階段性使用 2 mvvm model view viewmodel view與viewmodel之間雙向繫結，vue通過mvvm拆分檢視和資料 3 例項 4 生命週期 5 如果將使用者產生的內容使用v html輸出後，有可能導...
vue學習總結（一）
html部分 插值表示式 存在閃爍問題，但不會覆蓋元素中原本的內容 v cloak 解決插值表示式閃爍的問題 v text 沒有閃爍問題且覆蓋元素中原本的內容，內容當作字串顯示 v html 沒有閃爍問題且覆蓋元素中原本的內容，內容當作html顯示 v bind vue提供的屬性繫結機制 縮寫是 v...
vue學習問題總結（一）
使用comopontent元件報錯 錯誤資訊 vue.js 491 vue warn unknown custom element did you register the component correctly?for recursive components,make sure to provi...