讲解v-cloak,v-text,v-html的基本使用
v-cloak的基本使用：
用法：这个指令保持在元素上直到关联实例结束编译。 和 CSS 规则如 [v-cloak] { display: none } 一起用时，这个指令可以隐藏未编译的 Mustache 标签直到实例准备完毕。
利用v-cloak解决vue.js的插值表达式问题。
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>v-cloak，v-text，v-click Demo</title> <script src="https://unpkg.com/vue/dist/vue.js"></script> <style> [v-cloak]{ display: none; } </style> </head> <body> <div id="app"> <p v-cloak>{{message}}</p> </div> <script> var vm = new Vue({ el:"#app", data:{ message:"我是插值表达式!" } }) </script> </body> </html>
v-text的基本使用：
既然可以利用v-text解决文本插入内容，为什么还有插值表达式{{}}。
①v-text会覆盖元素中原本内容，但是插值表达式，只会替换自己的占位符，不会把整个元素的内容清空
②v-text不存在会出现闪烁{{插值表达式}}，插值表达式会
v-html的基本使用
利用v-html，出入html格式的字符串，转化为显示的内容。