vue指令-v-show和v-if

1、目标

控制标签的隐藏或出现

2、语法

v-show="Vue变量"
v-if="Vue变量"

示例；

<template>
  <div id="app">
    <div>
     <h1 v-show="isShow">我是h1</h1>
     <h2 v-if="isOk">我是h2</h2>
    </div>
    <!--
      v-show 隐藏：采用display:none
      v-if 隐藏: 采用从DOM树最直接移除
    -->
    <!--v-if和v-else使用-->
    <p v-if="age>=18"> 成年了 </p>
    <p v-else> 未成年 </p>
   
    
  </div>
  
</template>

<script>


export default {
  data(){
    return{
      
      isShow:false ,
      isOk:false,
      age:20
      
    }
    
  },
  
  
  
  
}
</script>