v-for

原创于 2018-06-22 11:19:23 发布 · 143 阅读

0 ·

CC 4.0 BY-SA版权

Vue.js 专栏收录该内容

16 篇文章

订阅专栏

我们用 v-for 指令根据一组数组的选项列表进行渲染。v-for 指令需要使用 item in items 形式的特殊语法，items 是源数据数组并且 item 是数组元素迭代的别名。

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>v-for</title>
	<script src="../vuejs/vue.min-1.0.28.js"></script>
</head>
<body>
	<div id='app'>
		<ul>
			<li v-for='(index,item) in list'>{{index}}-----{{item}}</li>
		</ul>
		<ul>
			<li v-for='(key,item) in user'>{{key}}-----{{item}}</li>
		</ul>
	</div>
	<script type="text/javascript">
		new Vue({
			el:'#app',
			data:{
				list:['pan','zhi','mao','wan','pan'],
				user:{name:'pan',sex:'男'}
				}
		});
	</script>
</body>
</html>