1、v-text 指令
展示对应data中数据内容,也能在数据基础上做运算,把标签中的内容替换,类似于innerText。
2、v-cloak 指令
{{}}这种插值符号在页面刷新的时候,会出现在页面上,也就是闪烁,为了解决这个问题,我们常常会在标签内添加v-cloak,然后再样式添加display:none。
3、v-html 指令
把html字符串当成html渲染,类似于innerHTML,但是要谨慎使用,不然会出大问题。
4、总结三种将数据渲染的页面的方法
① {{}} 最被常用,但是在加载的时候会出现闪烁问题(用v-cloak解决),无法将html格式数据渲染,只能当字符串展示
② v-text虽然没有数据加载闪烁问题,但是会将标签嵌套的文本覆盖,也不能渲染html格式数据。
③ v-html谨慎使用会出现xss攻击的风险。
5、v-once 指令
<divv-once>{{msg}}</div> 只渲染一次,后面数据再怎么变,页面也不会变
5、v-pre 指令
跳过这个元素和它的子元素的编译过程,可以用来显示原始 Mustache 标签。
跳过大量没有指令的节点会加快编译速度。