一. 模板語法
*** ?Vue.js 使用了基于 HTML 的模板語法，允許開發(fā)者聲明式地將 DOM 綁定至底層 Vue 實例的數(shù)據(jù)。所有 Vue.js 的模板都是合法的 HTML ，所以能被遵循規(guī)范的瀏覽器和 HTML 解析器解析。
在底層的實現(xiàn)上，Vue 將模板編譯成虛擬 DOM 渲染函數(shù)。結(jié)合響應(yīng)系統(tǒng)，在應(yīng)用狀態(tài)改變時，Vue 能夠智能地計算出重新渲染組件的最小代價并應(yīng)用到 DOM 操作上。
如果你熟悉虛擬 DOM 并且偏愛 JavaScript 的原始力量，你也可以不用模板，直接寫渲染 (render) 函數(shù)，使用可選的 JSX 語法。
二.插值方法
1. 文本插值
使用“Mustache”語法 (雙大括號) 的文本插值
Message: {{ msg }}
無論何時，綁定的數(shù)據(jù)對象上msg屬性發(fā)生了改變，插值處的內(nèi)容都會更新。
2. 通過v-once指令,只進(jìn)行一次插值,當(dāng)數(shù)據(jù)值改變值,插值出的內(nèi)容不會改變,但這會影響到該節(jié)點上的所有數(shù)據(jù)綁定
<span v-once>這個將不會改變: {{ msg }} </ span>
3. 原始HTML
雙大括號輸出的是撲通文本,不能輸出HTML標(biāo)簽,為了輸出原始HTML標(biāo)簽,使用v-html指令
<div v-html="rawHtml"></div>
div標(biāo)簽將會替換為屬性值rawHtml,直接作為HTML, 他會忽略屬性值里的數(shù)據(jù)綁定
重點 : ?你的站點上動態(tài)渲染的任意 HTML 可能會非常危險，因為它很容易導(dǎo)致XSS 攻擊。請只對可信內(nèi)容使用 HTML 插值，絕不要對用戶提供的內(nèi)容插值。
4. Mustache語法不能作用在html標(biāo)簽的特性上,可以使用v-bind指令
<button v-bind;disabled="isButtondisabled">BUTTON</button>
5. 使用JavaScript表達(dá)式
Vue.js 都提供了完全的 JavaScript 表達(dá)式支持
{{ number + 1 }}
{{ ok ? 'YES' : 'NO' }}
{{ message.split('').reverse().join('') }}
<div v-bind:id=" 'list-'+id " ></div>
重點: 這些表達(dá)式會在所屬 Vue 實例的數(shù)據(jù)作用域下作為 JavaScript 被解析有個限制就是，每個綁定都只能包含單個表達(dá)式，所以下面的例子都不會生效。
{{ var a = 1 }} ? ? ?// 語句,不是表達(dá)式
{{ if (ok) { return message } }} ? ? ?// 流控制,使用三元運算
三. 指令
指令 (Directives) 是帶有v-前綴的特殊屬性。指令屬性的值預(yù)期是單個 JavaScript 表達(dá)式(v-for是例外情況，稍后我們再討論)。指令的職責(zé)是，當(dāng)表達(dá)式的值改變時，將其產(chǎn)生的連帶影響，響應(yīng)式地作用于 DOM。回顧我們在介紹中看到的例子：
<p v-if="seen">現(xiàn)在看到我啦</p>
將根據(jù)seen傳入的值判斷p標(biāo)簽的插入和刪除
1. 參數(shù)
一些指令能夠接收一個參數(shù)(v-bind / ?v-on)
指令冒號后面的就是參數(shù),v-bind后面的參數(shù)可以用于響應(yīng)式的更行HTML標(biāo)簽的屬性
<a v-bind:href="url"></a>
將href 屬性與url數(shù)據(jù)進(jìn)行動態(tài)綁定
v-on 用于綁定DOM監(jiān)聽事件
<a v-on:click="doSomething"></a>
2. 修飾符
修飾符 (Modifiers) 是以半角句號.指明的特殊后綴，用于指出一個指令應(yīng)該以特殊方式綁定。例如，.prevent修飾符告訴v-on指令對于觸發(fā)的事件調(diào)用
<form v-on:submit.prevent="onSubmit"></form>
