Vue入门到放弃08（Vue条件判断 v-if，v-else-if，v-else）

最新推荐文章于 2023-01-18 15:27:01 发布

开猿节流

最新推荐文章于 2023-01-18 15:27:01 发布

阅读量165

点赞数

分类专栏： vue Vue入门到放弃

本文为博主原创文章，未经博主允许不得转载。交流联系QQ：634487911

本文链接：https://blog.csdn.net/qq_38191191/article/details/103387592

版权

vue 同时被 2 个专栏收录

27 篇文章 3 订阅

订阅专栏

Vue入门到放弃

21 篇文章 2 订阅

订阅专栏

v-if和v-else

<body>
    <div id="app">
        <h5>Modeng 是怎么样的一个人？</h5>
        <div v-if="isHandsome">非常帅</div>
        <div v-else>还是帅</div>
    </div>
    <script>
        var vm=new Vue({
           el:'#app',
           data:{
            isHandsome:true,
           },
           methods:{}
        });
    </script>
</body>

效果：

切换一下，效果：

v-if，v-else-if，v-else

<div id="root">
    <div v-if="type === 'A'">我是谁？</div>
    <div v-else-if="type === 'B'">我在哪？</div>
    <div v-else-if="type === 'C'">我怎么了？</div>
    <div v-else>谁能救救我！</div>
</div>
<script>
var vm = new Vue({
  el: "#root",
  data: {
    type: 'A'
  }
});
</script>

效果：

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

开猿节流

关注关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
Vue入门到放弃08（Vue条件判断 v-if，v-else-if，v-else）

v-if和v-else<body> <div id="app"> <h5>Modeng 是怎么样的一个人？</h5> <div v-if="isHandsome">非常帅</div> <div v-else>还是帅</div> &lt...
复制链接

扫一扫