vue内部指令:带有v-前缀的特殊属性,绑定表达式,类似js表达以及过滤器。特殊指令有的需要加“:”
作用:表达式的值 发生改变这个变换将反应在dom上。
常用指令:
v-if/v-else:判断true/false 显示与隐藏 可以减轻服务器压力,在需要的时候加载
v-show:调整css的display属性客户端操作更加流畅
v-for:数组循环渲染(a in arr);绑定a就可以循环出数组的内容
v-text:绑定数据 很好的解决了获取数据慢或者js出现问题时页面出现{{msg}}等字样
v-html:将js生成的html标签绑定在页面上(最好不要使用,容易被xss攻击)
v-on:监听事件( 简写@)不但能检测click而且还可以检测按下键盘:eg:keyup.enter=“”
v-model:绑定数据源 其有三种修饰符①v-model.lazy:离开焦点是执行②v-model.number:只能绑定数字③v-model.trim:元素前面的空格删掉
v-bind:标签属性绑定缩写“ :”
v-bind的应用场景:(绑定的值必须在data中声明)
1.可以直接绑定样式 v-bind:class=“类名”。
2.绑定判断 v-bind:class=“{class:isok}”,当isok为true时显示,为false时不显示。
3.绑定数字 v-bind:class=“[class,style]”.其中根本是绑定了多个类名。
4.绑定三元表达式 v-bind:class=“isok?class:style”。
5.绑定style v-bind:style=“{color:color}”data中声明color:‘blue’。
6.绑定对象 v-bind:style=“{objStyle}” 在data中使用eg:font-size应该改为驼峰是fontSize
v-pre:原样输出
v-cloak:渲染(页面)完成之后才显示
v-once:只在第一次加载时进行渲染,完成之后跳出渲染循环