1.v-if的使用
删除或创建元素
<div id="app">
<h2 v-if="isShow">{{messgae}}</h2>
</div>
</body>
<script>
const app = new Vue({
el:"#app",
data:{
message:'你好呀'
}
})
</script>
2.v-else的使用
<div id="app">
<h2 v-if="isShow">{{messgae}}</h2>
<h2 v-else>否则显示我</h2>
</div>
</body>
<script>
const app = new Vue({
el:"#app",
data:{
message:'你好呀',
isShow:true
}
})
</script>
3.v-if和v-else-if的使用
<div id="app">
<h1 v-if="score>=90">优秀</h1>
<h1 v-else-if="score>=80">良好</h1>
<h1 v-else>良好以下</h1>
</div>
</body>
<script>
const app = new Vue({
el:"#app",
data:{
score:99
}
})
</script>
4.v-show
更改style 只是隐藏了 切换频率高用这个
<div id="app">
<h2 v-show="isShow">{{messgae}}</h2>
</div>
</body>
<script>
const app = new Vue({
el:"#app",
data:{
message:'你好呀'
}
})
</script>