vue 获取 v-for 索引 学习 例子 整理 记录 自学 前端

• 2.x

<div id="app">
	<ul id="app">
	  <li v-for="(item,index) in items">
		{{ parentMessage }} - {{ index }} - {{ item.message }}
	  </li>
	</ul>
</div>

<script src="vue.js"></script>
<script type="text/javascript">
	var vm = new Vue({
		el: '#app',
		data: {
			parentMessage: 'Parent',
			items: [
			{ message: 'Foo' },
			{ message: 'Bar' }
			]
		}
	})
</script>

• 1.x

<div id="app">
	<ul id="app">
	  <li v-for="item in items">
		{{ parentMessage }} - {{ $index }} - {{ item.message }}
	  </li>
	</ul>
</div>

<script src="vue_v1.0.26.js"></script>
<script type="text/javascript">
	var vm = new Vue({
		el: '#app',
		data: {
			parentMessage: 'Parent',
			items: [
			{ message: 'Foo' },
			{ message: 'Bar' }
			]
		}
	})
</script>