v-if instruction

V-show with the same effect, essentially to toggle the display by manipulating dom element, the expression is true, dom element is present in the tree, the opposite is removed.

<div id="app">
        <div v-if="isCreated">动态创建和删除</div>
    </div>

<script src="http://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
    <script>
        var app = new Vue({
            el: "#app",
            data: {
                isCreated:true,   //创建  false删除
            },
        })

You can add and remove control node in the console:

app.isCreated
true
app.isCreated=false
false

More applications:
a button to switch the display state

<div id="app">
        <!--
            作用与v-show相同
            本质是通过操纵dom元素来切换显示状态
            表达式的值为true，元素存在于dom树中，相反则移除
        -->
        <input type="button" value="切换显示" @click="toggleIsShow">
        <!--一个样式一个dom-->
        <p v-if="isShow">Tiramisu</p>
        <p v-show="isShow">Tiramisu v-show</p>
        <h2 v-if="temperature>=35">热死了</h2>
    </div>

<!--  开发环境版本，包含了有帮助的命令警告-->
    <script src="http://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
    <script>
        var app = new Vue({
            el: "#app",
            data: {
               isShow:false,
               temperature:40
            },
            methods:{
                toggleIsShow:function(){
                    this.isShow=!this.isShow;
                }
            }
        })
    </script>