VUE2 条件渲染

条件渲染

v-show

特点：不展示的DOM元素未被移除，仅仅是使用样式隐藏掉了。

<div v-show="flag"></div>
<script>
    data(){
        return{
            flag: true
        }
    }
<script>

v-if/v-else-if/v-else

v-if/v-else-if/v-else要紧挨在一起。
特点：不展示的DOM元素直接被移除。

<div v-if="flag === 1"></div>      <!-- 可以使用 <template v-if=""></template> -->
<div v-else-if="flag === 2"></div>
<div v-else="flag === 3"></div>
<script>
    data(){
        return{
            flag: 1
        }
    }
<script>