Vue:列表渲染 v-for on a <template>

类似于 v-if,你也可以利用带有 v-for 的 <template> 渲染多个元素。比如:

<html>
  <head>
    <title>Vue v-for on a template</title>
    <script src="vue.js"></script>
  </head>
  <body>
   <div id="app">
      <ul>
        <template v-for="item in items"> 
          <li>{{item.language}}</li>
          <li>---------</li>
        </template>
      </ul>
   </div>
   <script>
     new Vue({
        el:"#app",
        data:{
          items:[
             {language:"css"},
             {language:"JavaScript"},
             {language:"Vue.js"}          
          ]
        }
     })
   </script>
  </body>
</html>

显示如下:

 

posted @ 2018-03-19 11:19  珊迪·奇克斯  阅读(277)  评论(0编辑  收藏  举报