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 @   树苗叶子  阅读(38)  评论(0编辑  收藏  举报
相关博文:
阅读排行:
· PowerShell开发游戏 · 打蜜蜂
· 在鹅厂做java开发是什么体验
· 百万级群聊的设计实践
· WPF到Web的无缝过渡:英雄联盟客户端的OpenSilver迁移实战
· 永远不要相信用户的输入:从 SQL 注入攻防看输入验证的重要性
点击右上角即可分享
微信分享提示