vue常见4种指令
1、v-if:判断是否隐藏
2、v-for:数据循环
3、v-bind:class:绑定一个属性
4、v-model:实现数据双向绑定
拓展:5.v-on 指令 事件指令,可以接受一个定义的方法来使用。
这里重点说明一个v-if和v-show的区别:
共同点:都是通过判断绑定数据的true/false来展示的
不同点:v-if只有在判断为true的时候才会对数据进行渲染,如果为false代码删除。除非再次进行数据渲染,v-if才会重新判断。可以说是用法比较倾向于对数据一次操作。
v-show是无论判断是什么都会先对数据进行渲染,只是false的时候对节点进行display:none;的操作。所以再不重新渲染数据的情况下,改变数据的值可以使数据展示或隐藏。
Vuejs2.0指令汇总:
v-html ="..." /该指令绑定对象用于向网页输出数据 再用data向其中赋值。
v-model 双向绑定数据
v-text 展示对应文本
v-once 渲染对应的标签一次1
v-html 把赋值的标签渲染出来
v-on: 事件绑定 . 事件类型 =‘函数’或者 @ 事件类型=‘函数 ’
v-if 判断指令(true or false )
v-show='布尔对象',在data中为该对象赋值 true则显示内容,反之则不现实 (注意 :注:v-show 不支持 元素,也不支持 v-else,且v-show会在开始对内容进行渲染 但是现不现实 由对象的布尔值来控制 )
v-for =循环显示元素,可以循环数组
v-cloak 防止页面加载时出现vuejs的变量名指令 ,在项目 开发中 。经常会遇到当数据在加载时的vue标签闪现,在数据加载 完后消失,这时候 就会用到该指令 。
v-bind 适用于绑定行内属性
计算属性:computed 属性是基于它的依赖缓存,只有相关依赖发生改变时才会重新取值。而使用 methods 属性,在重新渲染的时候,函数总会重新调用执行。通俗点就是一个n+=1的函数操作, 如果我之前计算过 一个对象 初始值为1输出一次得2再次输出,依赖内存的computed属性会有 上次输出的结果就直接输出了缓存中的结果 ,而methods会 在第二次输出3第三次4一次加一。