Vue之列表渲染

6、列表渲染

v-for：列表循环指令
例1：简单的列表渲染

<!-- 1、简单的列表渲染 -->
<ul>
    <li v-for="n in 10">{
  { n }} </li>
</ul>
<ul>
    <!-- 如果想获取索引，则使用index关键字，注意，圆括号中的index必须放在后面 -->
    <li v-for="(n, index) in 5">{
  { n }} - {
  { index }} </li>
</ul>

例2：遍历数组，使用计算属性

data: {
    numbers: [1, 2, 3, 4, 5]
}

<!-- 2、遍历数组，使用计算属性 -->
<ul>
    <li v-for="n in numbers