v-if和v-show
v-show和v-if都是vue的指令。我们通过v-if或者v-show可以控制元素的显示和隐藏。
v-if可以和v-else-if，v-else一起使用进行逻辑判断
<template>
<div>
<div v-if="num === 1">num 的值{{num}}</div>
<div v-else-if="num === 2">num的值{{num}}</div>
<div v-else>{{num}}</div>
</div>
</template>
<script>
export default{
data(){
return {
num:1
}
}
}
</script>
v-show的使用和v-if类似
<div v-show="num === 2">33333</div>
区别：
1 v-if相当于把dom移除了，v-show相当于加了一个属性display:none,所以如果是频繁显示隐藏切换的，使用v-show可以提高性能。
2 v-if 可以在template标签上使用，v-show不可以。
v-for
语法 v-for = "(item,index) in arr" v-for必须有属性:key key的作用主要是为了高效的更新虚拟DOM,key值只能是数字或字符串,这个key属性必须是唯一的标识.
v-for多数用来遍历数组，但也可以便利对象
遍历数组：
<div v-for="(item,index) in list" :key="index">{{item}}</div>
// ....
data(){
return {
num:1,
list:['苹果','菠萝','橘子','葡萄']
}
}
遍历对象
<div v-for="(value,key,index) in obj" :key="index">{{key}}:{{value}}--{{index}}</div>
// ...
obj:{
name:'zhangsan',
age:18
}
name:zhangsan--0
age:18--1
注意：v-if和v-for不能同时使用，因为v-if的优先级是大于v-for的。可以在v-for中嵌套v-if
