丁鹿学堂前端培训：vue基础之v-if，v-show，v-for

v-show和v-if都是vue的指令。我们通过v-if或者v-show可以控制元素的显示和隐藏。

v-if可以和v-else-if，v-else一起使用进行逻辑判断

v-show的使用和v-if类似

33333

1 v-if相当于把dom移除了，v-show相当于加了一个属性display:none,所以如果是频繁显示隐藏切换的，使用v-show可以提高性能。

2 v-if 可以在template标签上使用，v-show不可以。

语法 v-for = “(item,index) in arr” v-for必须有属性:key key的作用主要是为了高效的更新虚拟DOM,key值只能是数字或字符串,这个key属性必须是唯一的标识.

v-for多数用来遍历数组，但也可以便利对象

遍历数组：

{{item}}
// ....
 data(){
      return {
        num:1,
        list:['苹果','菠萝','橘子','葡萄']
      }
    }

遍历对象

{{key}}:{{value}}--{{index}}
// ...
obj:{
          name:'zhangsan',
          age:18
        }

name:zhangsan–0
age:18–1

注意：v-if和v-for不能同时使用，因为v-if的优先级是大于v-for的。可以在v-for中嵌套v-if