<html><head><style>.pclass{color:red;margin-bottom: 20px;}</style></head><body><div id="app"><p class="pclass"> 1.普通for：</p><ul><li v-for="a in values">当前数据：{{a}}</li></ul><p class="pclass"> 2.普通for带slice：</p><ul><li v-for="a in values.slice(0, 2)">当前数据：{{a}}</li></ul><p class="pclass"> 3.带下标的for,和通过下标进行获致：</p><div v-for="(a,i) in values":key="i"> 当前数据：{{a}},数组读取：{{values[i]}},下标：{{i}} </div><p class="pclass"> 4.遍历对象：</p><ul><li v-for="(v,k,i) in student">value:{{v}},key:{{k}},下标:{{i}}</li></ul><p class="pclass"> 5.嵌套遍历数组对象：</p><ul><li v-for="(student,i) in students"><span> student:{{student}},下标：{{i}} </span></br><span v-for="(v,k,j) in student"> 下标:{{j}},value:{{v}},key:{{k}} </br> </span></li></ul></div></body><script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script><script>new Vue({//指定作用于那一个divel:'#app',//属性data:{values:[1,2,3,3,4,5],student:{name:'xiaoming',age:18},students:[{name:'xiaoming',age:18},{name:'xiaoli',age:20}]}});</script></html>
若有收获，就点个赞吧
0 人点赞
