zoukankan      html  css  js  c++  java
  • vue学习(十) v-for循环普通数组 、对象数组、 迭代数字

    //html
    <div id="app">
     <p v-for="item in list">{{item}}</p>
     <p v-for="(item, i) in list">索引{{i}}---值{{item}}</p>
     <p v-for="user in list2">id是{{user.id}}---名字是{{user.name}} </p>
     <p v-for="(user,i) in list2">id是{{user.id}}---名字是{{user.name}}---索引是{{i}}</p>
     //遍历对象身上的属性和值,除了有key value 在第三个位置上还有一个索引
     <p v-for="(key,value,i) in user">键是{{key}}---值是{{value}}---索引是{{i}}</p>
     
     //迭代数字 迭代从1开始
    <p v-for="count in 10">这是第{{count}}次循环</p> </div> //script <script>   var vm = new Vue({     el:'app',     data:{       list:[1,2,3,4,5,6,7],
          list2:[
            { id:1, name:'小白' },
            { id:2, name:'小黑' },
            { id:3, name:'小黄' }
          ],
          user:{
            id:1,
            name:'小红',
            gender:'女'
          }
        },     methods:{//methods中定义了当前vue实例中所有可用的方法           }   }) </script>
  • 相关阅读:
    驾照暂时不用年审,放心了
    痛筋
    摘枣
    当了一回山村教师
    补贴山村学校照片
    心中无敌,无敌于天下
    山路
    学会珍惜
    写给部分美女们
    不打羽毛球好多年
  • 原文地址:https://www.cnblogs.com/xuchao0506/p/10805726.html
Copyright © 2011-2022 走看看