vue 中 v-if 和 v-show 指令的共同点与不同点
共同点：
都可以用来控制元素的显示与隐藏
不同点：
v-if 指令是通过动态的删除或者添加 DOM 元素，来控制元素的显示与隐藏，比较消耗性能，如果元素不是经常显示隐藏切换，可以考虑用 v-if 。 v-show 指令是通过控制 css 样式中的 display: none/display: block，来控制元素显示与隐藏，适用于频繁显示隐藏切换的场景
v-if
<template>
<div>
<div v-if="show" class="v-if">v-if</div>
<div v-else class="v-else">v-else</div>
<!-- true 显示，false 隐藏 -->
</div>
</template>
<script>
export default {
data() {
return {
show: false
}
}
}
</script>
v-show
<template>
<div>
<div v-show="show" class="v-show">v-show</div>
<!-- true 显示，false 隐藏 -->
</div>
</template>
<script>
export default {
data() {
return {
show: false
}
}
}
</script>
