学vue.js的一些练习（自用）

 

1.v-for循环语句

（1）v-for循环指令

        <div id="div1">
            <ol>
                <li v-for="site in sites">
                    {{ site.name }}
                </li>
            </ol>
        </div>

            new Vue({
                el:'#div1',
                data:{
                    sites:[
                        {name:'helloworld'},
                        {name:'helloworld'},
                        {name:'helloworld'}
                    ]
                }
            })

（2）v-for 可以通过一个对象的属性来迭代数据：

<div id="app">
  <ul>
    <li v-for="value in object">
    {{ value }}
    </li>
  </ul>
</div>
 
<script>
new Vue({
  el: '#app',
  data: {
    object: {
      name: '菜鸟教程',
      url: 'http://www.runoob.com',
      slogan: '学的不仅是技术，更是梦想！'
    }
  }
})
</script>