zoukankan      html  css  js  c++  java
  • vue 分支结构 循环结构

    v-if、v-else,v-if-else,v-show

    v-if、v-else,v-if-else渲染时只渲染满足条件的一条

    v-show 只有ture和flase两个值,通过控制display来控制

    条件判断语句写在html中例

    <div id="app">

      <div v-if="score>=90">优秀</div>

      <div v-if-else="90>score&&score>=80">良</div>

      <div v-if-else="80>score&&score>=60">一般</div>

      <div v-else>很差</div>

    </div>

    <script>
        var vm=new Vue({
            el:"#app",
            data:{"
      score:99
            },
            methods:{
               
            }
        })
    </script>

    循环结构

    v-for

    如果数组包含的是对象数据,则插值表达式中用name.来输出

    key的作用

    帮助vue提供性能,可以用name.id,或者用index

    遍历数组

    <ul>

    <li v-for=”(name,index) in arr">{{name+" “ +index}}</li>

    </ul>

    <script>
        var vm=new Vue({
            el:"#app",
            data:{
      arr:["1","2","3"]
            },
            methods:{    }
        })
    </script>
     
  • 相关阅读:
    开通博客
    简单、方便、实用的日志记录系统
    浅谈近两年工作
    前端构建神器之 gulp
    CSS 3 transition属性
    angular.extend相关知识
    angular.element相关知识
    angularJS之$apply()方法
    Jquery选择器
    Jquery选择器小节
  • 原文地址:https://www.cnblogs.com/marswenze/p/13026025.html
Copyright © 2011-2022 走看看