精读 Vue 官方文档系列 🎉
这里列出一些不在基础建教程中提到的指令。
v-text
使用 textContent 来更新元素的内容。
与插值表达式同样的效果,通常不会单独使用指令的方式。
v-html
使用 innerHTML 来更新元素的内容。
插入的内容会被浏览器当做普通的 HTML 代码进行解析与渲染。
在网站上动态渲染任意 HTML 是非常危险的,因为容易导致 XSS 攻击。只在可信内容上使用 v-html,永不用在用户提交的内容上。
v-pre
跳过这个元素和它的子元素的编译过程。可以用来显示原始 Mustache 表达式。
跳过大量的模板节点会加快编译速度。
<span v-pre>{{ this will not be compiled }}</span>
v-cloak
这个指令保持在元素上直到关联实例结束编译。和 CSS 规则如 [v-cloak] { display: none } 一起用时,这个指令可以隐藏未编译的 Mustache 直到实例准备完毕。
v-once
只渲染元素和组件一次。随后的重新渲染,元素/组件及其所有的子节点将被视为静态内容并跳过。这可以用于优化更新性能。
与 v-pre 的区别就是 v-pre 完全不会编译,直接跳过。