加入收藏 | 设为首页 | 会员中心 | 我要投稿 李大同 (https://www.lidatong.com.cn/)- 科技、建站、经验、云计算、5G、大数据,站长网!
当前位置: 首页 > 百科 > 正文

Vue.js学习教程之列表渲染详解

发布时间:2020-12-17 02:58:02 所属栏目:百科 来源:网络整理
导读:本文主要给大家介绍了关于Vue.js列表渲染的相关资料,分享出来给大家参考学习,下面来看看详细的介绍: v-for 可以使用 v-for 指令基于一个数组渲染一个列表。这个指令使用特殊的语法,形式为item in items,items 是数据数组,item 是当前数组元素的别名:

本文主要给大家介绍了关于Vue.js列表渲染的相关资料,分享出来给大家参考学习,下面来看看详细的介绍:

v-for

可以使用 v-for 指令基于一个数组渲染一个列表。这个指令使用特殊的语法,形式为item in items,items 是数据数组,item 是当前数组元素的别名:

示例:

在 v-for 块内我们能完全访问父组件作用域内的属性,另有一个特殊变量 $index,正如你猜到的,它是当前数组元素的索引:

另外,你可以为索引指定一个别名(如果 v-for 用于一个对象,则可以为对象的键指定一个别名):

从 1.0.17 开始可以使用 of 分隔符,更接近 JavaScript 遍历器语法:

template v-for

类似于 template v-if,也可以将 v-for 用在