v-show的使用

v-show的使用

v-show也是用来显示和隐藏元素的，它是用cssdisplay:none来实现的。
代码：

<template>
  <div>
    <div v-show="show1">show1:{{show1}}</div>
    <div v-show="show2">show2:{{show2}}</div>
  </div>
</template>

<script>

export default {
    data(){
        return {
           show1:false,
           show2:true,
        }
    }
}
</script>

<style>
</style>

页面上显示了show2:true,但是通过浏览器的元素审查，我们可以发现body里面的元素

<div>
    <div style="display: none;">show1:false</div>
    <div>show2:true</div>
</div>

这证明了，它是用cssdisplay:none来实现的。