网站对位,电商网站构建,设计网站建设公司,百度账号查询对于v-for指令#xff0c;以前老是不能理解#xff0c;经常记混#xff0c;所以特地写篇笔记来加强下记忆#xff0c;希望借此能学的更深刻一点 v-for顾名思义就是个for循环#xff0c;是vue的一个循环。在遍历json字符串的时候有奇佳的效果#xff0c;感觉就是为他们而造… 对于v-for指令以前老是不能理解经常记混所以特地写篇笔记来加强下记忆希望借此能学的更深刻一点 v-for顾名思义就是个for循环是vue的一个循环。在遍历json字符串的时候有奇佳的效果感觉就是为他们而造的。
1、数组
如果给你个数组里面放了值你怎么遍历出来呢。在java中一般用for循环再用个i把整个整个数组渲染出来而vue则简化了这个操作相当于将item变成一个变量自动实行item的操作就是接口已经给你写好了你只要把数组给我就行了。然后自动将数组里的值赋给item。
data(){return{arr:[8,9,10,11,12,13 ]}}
}p v-foritem in arr{{item}}/p完整的写法是
p v-for(item,i) in arr数组里的值是{{item}} 数组序号{{i}} /p有数组的值和数组的序列号且序列号是从0开始的。 值得注意的是一般我们不加括号们也不使用序列号item默认取的数组里的值如果反过来是(i,item)那么item会变成序列号。
既然数组是这样的那么后面的数组对象就是在这基础之上完成了。
2、数组对象
这个用的最频繁最常用 objectArr:[{name:zs,con:你好啊,zs},{name:ls,con:你好啊,ls},{name:ww,con:你好啊,ww},{name:zl,con:你好啊,zl},{name:lq,con:你好啊,老铁}]p v-for(item,i) in objectArr{{i}}{{item.name}} /p 3、对象
这里循环的是键值对写出一个键值对后面的重复渲染
obj:{name:zs,age:17,sex:男,password:123456}p v-for(value,key) in obj键{{key}}年龄{{value}}/p4、数字
这个最简单的数字遍历循环从1到cout依次输出
p v-forcount in 8{{count}}/p
