vue之迭代对象

最新推荐文章于 2023-04-11 14:33:55 发布

清风自来&静等花开

最新推荐文章于 2023-04-11 14:33:55 发布

阅读量1.6k

点赞数 1

分类专栏： vue 文章标签： vue v-for

本文链接：https://blog.csdn.net/qq_32403063/article/details/88871491

版权

本文将详细阐述Vue中如何使用v-for指令迭代对象，包括对象循环、键值对迭代及数组迭代，结合具体语法和示例进行讲解。

摘要由CSDN通过智能技术生成

下面介绍一下，vue迭代对象的语法

引用vue的地址为：https://cdn.staticfile.org/vue/2.2.2/vue.min.js
1、对象循环

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>循环语句</title>
<script src="https://cdn.staticfile.org/vue/2.2.2/vue.min.js"></script>
</head>
<body>
	<div id="app2">
		<ul>
			<li v-for="value in object">
				{
  {value}}
			</li>
		</ul>
	</div>
	<script>
		new Vue({
			el : '#app2',
			data : {
				object : {
					name : 'apple',
					url : 'https://blog.csdn.net/qq_32403063',
					slogan : 'i am fun'
				}
			}
		});
	</script>
</body>
</html>

2、以键值的形式迭代对象

<html>
<head>
<meta http-

最低0.47元/天解锁文章

清风自来&静等花开

关注

1
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
vue之迭代对象

下面介绍一下，vue迭代对象的语法引用vue的地址为：https://cdn.staticfile.org/vue/2.2.2/vue.min.js1、对象循环<html><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"><title>循环语句...
复制链接

扫一扫

专栏目录