1. 程式人生 > >Vue的v-for用法

Vue的v-for用法

遍歷陣列

// html部分
<ul v-for="(item,index) in obj">
                ↑
           要用到什麼資料就要說出來
	<li>{{ index }}:{{ item }}</li>
</ul>


// vue部分
var vm = new Vue({
  el:'.word',
  data:{
	obj:[1,2,3,4,5]
	}
})

遍歷物件

物件的語法是{ key:value  }這就不用說了吧,item在這裡實際上就是value

// html部分
<ul v-for="(item,key) in arr">
                ↑
           要用到什麼資料就要說出來
	<li>{{ key }}:{{ item }}</li>
</ul>


// vue部分
var vm = new Vue({
  el:'.word',
  data:{
	arr:{name:'白痴',sex:'不男不女',hobby:'搞gay‘'}
	}
})