vue學習筆記【六、v-for遍歷】

遍歷數據並顯示:

<template>
	<div>
		<h3>遍歷數組</h3>
		<ul>
			<li v-for="(person,index) in persons">
				{{index}}==:  姓名:{{person.name}},年齡:{{person.age}},姓別:{{person.sex}}
			</li>
		</ul>
		
		<h3>遍歷對象</h3>
		<ul>
			<li v-for="(item,key) in persons[0]">
				{{key}}==:  {{item}}
			</li>
		</ul>
	</div>
</template>

<script>
	export default{
		name:"ComputedAndWatch",
		data(){
			return {
				persons:[
					{name:'aa',age:12,sex:'男'},
					{name:'bb',age:13,sex:'男'},
					{name:'cc',age:14,sex:'女'},
					{name:'dd',age:18,sex:'男'}
				]
			}
		}
	}
</script>

<style scoped>
	
</style>

 

 

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章