为什么result 只有<60的时候才打印d，其他条件的a b c都不输出
0
[已解决问题]
解决于 2018-07-13 18:23
<body>
<div id="div10">
<h3 v-if="result<0">成绩尚未公布</h3>
<h3 v-else-if="result < 60"> d <h3>
<h3 v-else-if="result < 80"> c <h3>
<h3 v-else-if="result < 90"> b <h3>
<h3 v-else> a </h3>
<p>当前成绩:{{result}}</p>
<button v-on:click="changeResult">随机分数</button>
</div>
</body>
<script>
var var_div10 = new Vue({
el: "#div10 ",
data: {
result: -1
},
methods: {
changeResult: function () {
this.result = Math.round(Math.random() * 100);
}
}
});
</script>
最佳答案
0
<h3 v-if="result<0">成绩尚未公布</h3>
<h3 v-else-if="result < 60"> d </h3>
<h3 v-else-if="result < 80"> c </h3>
<h3 v-else-if="result < 90"> b </h3>
<h3 v-else> a </h3>
<!--
下面的写法v-if v-else-if v-else是无法连续性条件渲染的，因为标签组写错了，每个条件的最后的<h3>必须是关闭的</h3>
<h3 v-else-if="result < 60"> d <h3>
<h3 v-else-if="60 <= result < 80"> c <h3>
<h3 v-else-if="80 <= result < 90"> b <h3> -->
