使用Vue进行列表渲染：

v-for 指令基于一个数组来渲染一个列表。v-for 指令需要使用 item in items 形式的特殊语法，其中 items 是源数据数组，而 item 则是被迭代的数组元素的别名

html代码如下：

<ul id="example">
  <li v-for="item in items" :key="item.message">
    {{ item.message }}   
  </li>
</ul>

Js代码如下：

var example = new Vue({
  el: '#example', 
   data: {   
    items: [
      { message: '森林君' },
      { message: '博客' }
    ]
  }
})

响应输出：

    • 森林君

    • 博客

v-for 中使用对象：

html代码如下：

<ul id="object">
  <li v-for="value in object">
    {{ value }}  
  </li>
</ul>

Js代码如下：

new Vue({
  el: '#object', 
   data: {    
     object: { 
        title: '森林君博客', 
        author: '森林君',
        publishedAt: '2021-09-21'
    }
  }
})

响应输出：

    • 森林君博客

    • 森林君

    • 2021-09-21