v-for的使用：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<style>
ul{
list-style: none;
padding: 0;
}
li{
padding: 10px;
background-color: #f2f2f2;
margin-bottom: 10px;
}
</style>
<body>
<!--
v-for 用法：用in或of指令来遍历数组或对象，并将当前的元素或属性值赋给一个变量。
:key 指令用来给Vue实例中的每个元素或组件添加一个唯一标识符，以便它能跟踪每个节点的变化。
-->
<div id="app">
<ul>
<li v-for="(name,index) in names" :key="index">{{index+1}}:{{name}}</li>
</ul>
<hr>
<ul>
<li v-for="(item,key,index) in listObj" :key="listObj.id">{{index+1}}:{{key}}:{{item}}</li>
</ul>
</div>
<script src="vue.js"></script>
<script>
var vm=new Vue({
el:'#app',
data:{
names:['北京','贵州','云南','重庆'],
listObj:[
{
id:1001,
name:'小红',
age:20
},
{
id:1002,
name:'小刚',
age:25
},
]
}
})
</script>
</body>
</html>