VUE中列表渲染,遍历数组和对象
数组遍历,对象遍历,数字遍历,字符串遍历,可迭代协议的遍历
为什么绑定KEY,给每个虚拟节点唯一的ID,本案例没有绑定KEY
v-for="(person,index) in persons
(使用了v-for)
<template>
<div>
<h3>遍历数组</h3>
<ul>
<li v-for="(person,index) in persons">
{{index}} 姓名:{{person.name}},年龄:{{person.age}},性别:{{person.sex}}
</li>
</ul>
</div>
</template>
<script>
export default {
name: "ListRender",
data(){
return{
persons:[
{name:'ZS',age:'18',sex:'男'},
{name:'LS',age:'28',sex:'女'},
{name:'WW',age:'38',sex:'男'},
{name:'ZL',age:'48',sex:'女'},
{name:'LQ',age:'58',sex:'男'}
]
}
}
}
</script>
<style scoped>
</style>