模板語法

• 文本
  數據綁定最常用的形式就是使用雙大括號的文本插值
  <span>Message: {{ msg }}</span>
• html代碼
  雙大括號會將數據解釋為普通文本，而非 HTML 代碼。為了輸出真正的 HTML ，你需要使用 v-html 指令：
  <div v-html="rawHtml"></div>
  這個 div 的內容將會被替換成為屬性值 rawHtml，直接作為 HTML——會忽略解析屬性值中的數據綁定
• js表達式

{{ number + 1 }}
{{ ok ? 'YES' : 'NO' }}
{{ message.split('').reverse().join('') }

這些表達式會在所屬 Vue 實例的數據作用域下作為 JavaScript 被解析。有個限制就是，每個綁定都只能包含單個表達式，所以下面的例子都不會生效。

{{ var a = 1 }}
{{ if (ok) { return message } }}

• 參數
  一些指令能夠接收一個“參數”，在指令名稱之后以冒號表示。例如，v-bind 指令可以用于響應式地更新 HTML 屬性：
  <a v-bind:href="url">...</a>
  另一個例子是 v-on 指令，它用于監聽 DOM 事件：
  <a v-on:click="doSomething">...</a>

• 縮寫

v-bind：

<!-- 完整語法 -->
<a v-bind:href="url">...</a>
<!-- 縮寫 -->
<a :href="url">...</a>

v-on:

<!-- 完整語法 -->
<a v-on:click="doSomething">...</a>
<!-- 縮寫 -->
<a @click="doSomething">...</a>