<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<div id="app">
<ul>
<!-- :key="item.id" 使用v-for的时候，必须绑定唯一的标识，便于日后的修改更正 -->
<li v-for = '(item,index) in menus' :key="item.id">
<h3>{{index}}-id:{{item.id}} 菜名:{{item.name}}</h3>
</li>
</ul>
<ol>
<li v-for="(val,key) in obj" :key = 'key'>
{{key}}--{{val}}
</li>
</ol>
</div>
<script src="vue.js"></script>
<script>
new Vue({
el:'#app',
data:{
menus:[
{id:1,name:'大腰子'},
{id:2,name:'大腰'},
{id:3,name:'大子'},
{id:4,name:'腰子'},
],
obj:{
title:'循环',
author:'walter'
}
}
})
</script>
</body>
</html>