微客导航 » 文章资讯 » vue 使用v-for进行循环的实例代码详解

vue 使用v-for进行循环的实例代码详解

2023-08-01 00:12:05 180

代码如下所示：







vue中使用v-for



循环列表




序号
书名
作者



{{index+1}}
{{book.title}}
{{book.author}}

序号	书名	作者
{{index+1}}	{{book.title}}	{{book.author}}

循环对象

{{key}}:{{value}}

"(book,index)inbooks"是循环表达式，式中的“(book,index)”不可调换位置，对象，第二个才是索引，且索引是从0开始的，所以在下面写序号时，才会是“+1”第一个永远为对象。

循环状态保持。默认情况下，如果数组中的顺序发生变化，或者个数发生变化导致重新渲染，那么vue会重新利用之前的元素，而不会重新排序，这样在某些情况下可能是想要的，但是绝大部分情况可能不是我们想要的，这时候可以添加key属性。可以只能够是number和str类型，那么在循环时一般使用循环出来的对象的某个唯一值，不要使用index来做key，这样虽然用了，但是没有效果。在vue2.2.x以上，在自定义组件上使用v-for，key是必须要写的。

总结

以上所述是小编给大家介绍的vue使用v-for进行循环的实例代码详解，希望对大家有所帮助，也非常感谢大家对毛票票网站的支持！

声明：本文内容来源于网络，版权归原作者所有，内容由互联网用户自发贡献自行上传，本网站不拥有所有权，未作人工编辑处理，也不承担相关法律责任。如果您发现有涉嫌版权的内容，欢迎发送邮件至：czq8825#qq.com（发邮件时，请将#更换为@）进行举报，并提供相关证据，一经查实，本站将立刻删除涉嫌侵权内容。

返回顶部
3162201930
czq8825@qq.com

vue 使用v-for进行循环的实例代码详解

循环列表

循环对象

热门推荐

随机推荐