vue if

vue if
1 Star2 Stars3 Stars4 Stars5 Stars 給文章打分!
Loading...

條件渲染


<div id="myDiv">
<h2>條件渲染</h2>
<p>成績:{{score}}</p>
<p v-if="score<60">不及格</p>
<p v-else-if="score<80">良好</p>
<p v-else>優秀</p>
<button @click="click">隨機設定成績</button>
<p v-show="score<60">show不及格</p>
</div>
<script>
//在dom中會消失
var myDiv = new Vue({
el: "#myDiv",
data: {
score: 0
},
methods: {
click: function () {
this.score = Math.round(Math.random() * 100)
}
}
})
</script>

 

使用v-if 不滿足條件的會在dom樹中消失

 

v-show在dom中存在只是不顯示

相關文章

程式語言 最新文章