for of遍历数组(v-for 遍历数组数字)
导读:1.v-for遍历数组 v-for 相当于js for循环,直接写在标签内使用,循环生成标签。例如:...
1.v-for遍历数组
v-for 相当于js for循环,直接写在标签内使用,循环生成标签 。例如:
<div v-for="(item,index) in arr">{{item}}<div>
arr 是一个数组
item 代表数组中每一项 ,
index代表数组的索引
可以在标签内使用数组的元素,如果数组中的每一项还有数组,则可以嵌套多层for循环
2.v-for遍历数组
和v-for使用相似 ,例如:
<div v-for="(item,index) in 3">{{item}}<div>
但要注意的是:
v-for 遍历数组 ,索引从0开始,v-for遍历数字索引从1开始
3. v-for v-if 连用
在vue2和vue3中v-for ,和v-if 的优先级不同 ,
vue2 中 v-for的优先级高于v-if,如果v-for 和v-if 在同一个标签内 ,则会先循环后判断 ,这样显然不明智,可以在在外层嵌套 ,template标签 ,先进行v-if判断,因为template标签是不显示的,所以不用担心结构问题 ,先判断再进行循环。
在vue3 中 v-if的优先级要高于v-for 先判断后循环减少了循环的次数,提高了渲染性能 。
创心域SEO版权声明:以上内容作者已申请原创保护,未经允许不得转载,侵权必究!授权事宜、对本内容有异议或投诉,敬请联系网站管理员,我们将尽快回复您,谢谢合作!