[TOC] # 綁定語法 ### 1.v-pre 指令 讓在data里面定義的變量不通過渲染顯示，直接正常顯示內容 ### 2. v-html指令 若定義的變量中帶有標簽，則顯示標簽在頁面內容中，相當于innerHtml ### 3.v-text指令 將變量的內容顯示在指定標簽頁面中，若內容中包含有標簽，會把標簽認為是字符顯示，相當于innerText ***** ### 例子 ``` <div id="app"> <p>{{a}}</p> <!-- 不渲染{{a}} --> <p v-pre>正常顯示{{a}} <span>也不會渲染{{a}}</span> </p> <!-- 顯示標簽，相當于innerhtml --> <p v-html = 'html'></p> <!-- 不顯示標簽，相當于innertext --> <p v-text = 'b'></p> <!-- 變量拼接 --> <p v-text = 'a + c'></p> <p>{{a + c}}</p> <p>=============</p> <!-- 當插值語法跟v-text指令同時存在時，瀏覽器后先渲染插值語法，然后再解析v-text指令，并且覆蓋前面的渲染結果 --> <p v-text = 'c'>{{a}}</p><!-- 結果為3 --> </div> <script> // 實例vue new Vue({ el:'#app', data:{ a:'變量a', html:'<a href="www.baidu.com">www.baidu.com</a>', b:'<p>標簽沒有作用</p>', c:3 } }) </script> ``` **注意** 當插值語法跟v-text指令同時存在時，瀏覽器后**先渲染插值語法，然后再解析v-text指令**，并且**覆蓋前面的渲染結果**