vue之条件渲染v-if

目录

说明

“vue条件渲染指令包括v-if、v-else、v-else-if、v-show。

语法

v-if="条件1&&条件2"       # 条件可以用变量+运算符号表示，&&表示and
v-if-else="条件"
v-else           # 因为是例外，所以不需要使用条件

示例

<body>
<div id="app">
    <h1>条件格式渲染</h1>
    <p v-if="score>=90">优秀</p>
    <p v-else-if="score<90&&socre>=80">良好</p>
    <p v-else-if="score<80&&socre>=60">及格</p>
    <p v-else>不及格</p>
</div>
</body>
<script>
    vm = new Vue({
        el: '#app',
        data:{
            score: 90
        },
    })
</script>
posted @ 2023-04-06 10:50  树苗叶子  阅读(50)  评论(0)    收藏  举报