vue 常用的指令有:v-text 、v-html、v-once、v-pre、v-if 、v-show、v-for、v-model 、v-bind、v-on 等等。
下面我们来展开说一下:
1. v-text
文本指令 会覆盖默认值
2. v-html
文本指令 用于输出html
3. v-once
元素只渲染一次 当数据发生变化时 不会再变化
4. v-pre
将内容原封不动的展示出来 不做任何处理
5. v-if 和 v-show
v-if 和 v-show 都可以控制元素的显示和隐藏
区别:
v-if 有更高的切换开销 v-show 有更高的 初始渲染开销
需要频繁的切换时 用 v-show 比较好 运行中条件很少改变时 用 v-if 较好
6. v-for
循环 实现列表渲染( item 代表每一项 index 代表下标)
7. v-model
双向绑定 只能用于表单 值必须在 data里
好处:
开发者不再需要手动操作DOM 元素,来获取表单元素最新的值
8.v-bind
用于绑定元素属性 可以将标签内的属性值解析成js代码,在标签的属性中使用 v-bind
简写为 :
9.v-on
绑定事件 用于监听指定元素的DOM事件
简写为 @