[Vue]内置指令

发布时间 2024-01-08 10:59:33作者: 夕苜19

常用内置指令:

v-bind 单向绑定解析表达式,可简写为 :
v-model 双向数据绑定
v-for 遍历数组 / 对象 / 字符串
v-on 绑定事件监听,可简写为 @
v-show 条件渲染 (动态控制节点是否展示)
v-if 条件渲染(动态控制节点是否存存在)
v-else-if 条件渲染(动态控制节点是否存存在)
v-else 条件渲染(动态控制节点是否存存在)
v-text 向其所在的节点中渲染文本内容,会替换掉节点中的内容,{{ }}不会
v-html 向指定节点中渲染包含html结构的内容,会替换掉节点中的所有内容
v-cloak 使用css配合v-cloak可以解决网速慢时页面显示{{ xxx }}的问题
vue实例创建完毕并接管容器后,会删除掉v-cloak。
v-once 节点在初次动态渲染后,就视为静态内容了,数据改变不再更新。优化性能。
v-pre 编译过程跳过v-pre所在节点,加快编译。
如:没有使用指令语法、没有使用插值语法的节点。

注意:

v-html有安全性问题!在网站上动态渲染任意html是非常危险的,容易导致XSS攻击。

一定要在可信的内容上使用v-html,永远不要用在用户提交的内容上!