码迷,mamicode.com
首页 > 其他好文 > 详细

v-for 指令

时间:2018-03-23 00:59:50      阅读:143      评论:0      收藏:0      [点我收藏+]

标签:vue   技术分享   图片   .com   set   一个   meta   https   列表   

v-for 指令可以绑定数组的数据来渲染一个项目列表

 

demo

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>Vue </title>
  <script src="https://cdn.bootcss.com/vue/2.2.2/vue.min.js"></script>
</head>
<body>
    <div id="app" >
      <ol>
        <li v-for="item  in items">
          {{item.text}}
        </li>
      </ol>

    </div>
<script>
       var  app=new Vue ({
         el:‘#app‘,
         data:{
           items:[
         {text:‘vue‘},
         {text:‘react‘},
         {text:‘angular‘}
         ]
         }

       })

</script>
</body>
</html>

  效果:
技术分享图片

 

2018-03-22   23:19:33

v-for 指令

标签:vue   技术分享   图片   .com   set   一个   meta   https   列表   

原文地址:https://www.cnblogs.com/guangzhou11/p/8627658.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!