文本

數據綁定最常見的形式就是使用“Mustache”語法 (雙大括號) 的文本插值：

無論何時，綁定的數據對象上 msg 屬性發生了改變，插值處的內容都會更新。

通過使用 v-once 指令，你也能執行一次性地插值，當數據改變時，插值處的內容不會更新。

效果：

輸出html

雙大括號會將數據解釋為純文本，而非 HTML 。為了輸出真正的 HTML ，你需要使用 v-html 指令：

效果：

屬性

雙大括號不能在 HTML 屬性中使用，該使用 v-bind 指令：

效果：

這對布爾值的屬性也有效 —— 如果條件被求值為 false 的話該屬性會被移除

使用 JavaScript 表達式

有個限制就是，每個綁定都只能包含單個表達式，所以下面的例子都不會生效。

過濾器

Vue.js 允許你自定義過濾器，被用作一些常見的文本格式化。過濾器應該被添加在雙大括號插值的尾部，由“管道符”指示：

如下過濾器代碼實現大寫首字母：

過濾器可以串聯：

過濾器是 JavaScript 函數，因此可以接受參數：

這裡，字符串 ‘arg1’ 將傳給過濾器作為第二個參數， arg2 表達式的值將被求值然後傳給過濾器作為第三個參數。

指令

指令 (Directives) 是帶有 v- 前綴的特殊特性。指令特性的值預期是單個 JavaScript 表達式 (v-for 是例外情況，稍後我們再討論)。指令的職責是，當表達式的值改變時，將其產生的連帶影響，響應式地作用於 DOM。回顧我們在vue.js初入門二中看到的例子：

這裡，v-if 指令將根據表達式 seen 的值的真假來插入/移除

元素。

一些指令能夠接收一個“參數”，在指令名稱之後以冒號表示。例如，v-bind 指令可以用於響應式地更新 HTML 特性：

在這裡 href 是參數，告知 v-bind 指令將該元素的 href 特性與表達式 url 的值綁定。

另一個例子是 v-on 指令，它用於監聽 DOM 事件：

v-bind和v-on,詳見vue.js初入門二。

縮寫

v-bind 縮寫

v-on 縮寫

修飾符

修飾符（Modifiers）是以半角句號 . 指明的特殊後綴，用於指出一個指定應該以特殊方式綁定。例如，.prevent 修飾符告訴 v-on 指令對於觸發的事件調用 event.preventDefault()：

閱讀更多 看到他請叫他快去學習 的文章

關鍵字: 綁定 技術 JavaScript