欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

【Vue】零基础学习Vue: 第7课 Vue指令v-if、v-else-if、v-else 的使用:

程序员文章站 2022-06-06 20:26:32
...
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Document</title>
  <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/vue.js"></script>
</head>
<body>
  <div id="app">
    <!-- a=1所以前两个都是fasle 所以只显示最后一个div-->
    <div v-if="a>2">我是v-if</div>
    <div v-else-if="a>3">我是v-else-if</div>
    <div v-else>我是v-else</div>
  </div>

  <script>
    let vm = new Vue({
      el:"#app",
      data:{
        a:1,
      }
    })
  </script>
</body>
</html>

运行结果如下:


我是v-else
相关标签: vue