这篇文章主要给大家介绍了关于Vue.js学习记录之在元素与template中使用v-if指令的相关资料，文中给出了详细的示例代码供大家参考学习，相信对大家具有一定的参考学习价值，需要的朋友们下面来一起看看吧。
本文主要给大家介绍的是关于Vue.js在元素与template中使用v-if指令的相关内容，分享出来供大家参考学习，下面来一起看看详细的介绍：
语法比较简单，直接上代码：
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title></title>
<script src="cdn.bootcss.com/vue/2.2.2/vue.min.js"></script>
</head>
<body>
<p id="wangtuizhijiademo">
<p v-if="instruction">在Vue.js中，当判断语句为true,可以显示信息，当为false时候不显示</p>
<template v-if="show1">
<p>我是 show1，默认是开启的（true），当你设置false我不显示！</p>
</template>
<template v-if="show2">
<p>我是 show2，默认是关闭的，当你设置show2的值为true，我会被显示！</p>
</template>
</p>
<script>
new Vue({
el: '#wangtuizhijiademo',
data: {
instruction:true,
show1: true,
show2: false
}
})
</script>
</body>
</html>true为开启状态，false为关闭状态。
有兴趣的可以试试把 show2: false的false改为true，可以看到两条信息，如下：
在Vue.js中，当判断语句为true,可以显示信息，当为false时候不显示
我是 show1，默认是开启的（true），当你设置false我不显示！
我是 show2，默认是关闭的，当你设置show2的值为true，我会被显示！
Atas ialah kandungan terperinci 在元素与template中使用v-if指令详解. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!
vue v-jika
Nombor telefon mudah alih maya untuk menerima kod pengesahan
Mengapa video dalam ppt tidak boleh dimainkan?
Algoritma penjadualan cakera
Bagaimana untuk memadam fail dalam linux
Bagaimana untuk memadam halaman kosong dalam word
Bagaimana untuk membuka fail keadaan
Apakah perbezaan antara lulus dengan nilai dan lulus dengan rujukan dalam java
![[Web front-end] Permulaan pantas Node.js](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
