v-for
其中(n in/of 10)使用in和of没有区别
<body>
<div id="box">
<ul>
<!-- 一般情况下key设置为item.id -->
<li v-for="(item,index) of list" :key="index">
{{item}}---{{index}}
</li>
</ul>
<ul>
<li v-for="(item,key,index) in objlist">
{{key}}---{{item}}---{{index}}
</li>
</ul>
<!-- n in 10 遍历的结果是数字1-10 -->
<ul>
<li v-for="n in 10">
{{n}}
</li>
</ul>
</div>
<script>
var vm = new Vue({
el: '#box',
data: {
list:['aaa','bbb','ccc'],
objlist:{
name:"aaa",
age:18,
location:"gansu"
}
}
})
</script>
</body>
key值：跟踪每个节点的身份，从而重用和重新排序现有元素，理想的key值每项都有的且唯一的id
创建虚拟dom，新旧虚拟dom进行对比，找到可以复用的节点，然后页面更新
image.png
