vue - for 遍历对象和遍历对象数组
1. 遍历对象时,参数： 第一个为值，第二个为键名，第三个为索引
<!DOCTYPE html>
<html lang="en"> <head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
<!-- Step1.对于vue,可以用cdn -->
<script src="https://cdn.bootcss.com/vue/2.5.17-beta.0/vue.min.js"></script>
<style>
#app div{
padding: 2%;
margin-bottom: 1%;
border-bottom: 1px solid #ddd;
background-color: blanchedalmond;
}
</style>
</head> <body> <div id="app"> <!-- 对象遍历 -->
<div v-for="(value, key, index) in object">
{{ index }}. {{ key }} - {{ value }}
</div> <!-- 数组对象遍历 -->
<div v-for="(value, key, index) in objectArray">
姓名：{{value.name}}
年龄:{{value.age}}
</div> </div> <script type="text/javascript">
var app = new Vue({
el: '#app',
data: {
// 对象
object: {
name: '张三',
names: '李四'
}, // 数组对象
objectArray: [
{
name: '张三',
age: 14
},
{
name: '李四',
age: 18
}
]
}
})
</script>
</body> </html>
vue - for 遍历对象和遍历对象数组的更多相关文章
- JSON语法、对象、遍历数组的区别和基本操作
JSON 语法规则 JSON 语法是 javascript 对象表示语法的子集. 数据在名称/值对中 数据由逗号分隔 花括号保存对象 方括号保存数组 JSON 名称/值对 JSON 数据的书写格式是: ...
- JS数组与对象的遍历方法大全
本文简单解析各种数组和对象属性的遍历方法: 原生for循环.for-in及forEach ES6 for-of方法遍历类数组集合 Object.key()返回键名的集合 jQuery的$.each() ...
- JS中数组与对象的遍历方法实例小结
一.数组的遍历: 首先定义一个数组 1 arr=['snow','bran','king','nightking']; 1.for循环,需要知道数组的长度; 2.foreach,没有返回值,可以不知道 ...
- JavaScript中，数组和对象的遍历方法总结
循环遍历是写程序很频繁的操作,JavaScript 提供了很多方法来实现. 这篇文章将分别总结数组和对象的遍历方法,新手可以通过本文串联起学过的知识. 数组遍历 方法一:for 循环 for 循环是使 ...
- Struts标签<s:iterator>遍历访问复杂Map对象
<s:iterator value="resultType" id="geneUi"> //拿到要遍历的Map对象 <s:iterator v ...
- Java基础知识强化之集合框架笔记06：Collection集合存储自定义对象并遍历的案例
1.练习:用集合存储5个学生对象,并把学生对象进行遍历. 分析: (1)创建学生类(2)创建集合对象(3)创建学生对象(4)把学生添加到集合(5)把集合转成数组(6)遍历数组 2. 代码示例: Stu ...
- js 对象属性遍历
function 对象属性遍历(){ var obj = {x:1,y:2,c:3};for (var name in obj){ alert ( obj[name] )} } function 数组 ...
- PHP对象的遍历
对象的遍历 对象的遍历,跟数组的遍历,一样! 其实,只能遍历出对象的“实例属性数据” foreach( $对象名 as $key => $value){ //这里就可以处理$key和$va ...
- jquery中object对象循环遍历的方法
一个朋友问对象如何转为数组,当我问他为啥要转得时候,他告诉我,数组可以用js循环遍历,而对象则不可以.其实呢,对象同样可以循环遍历的啊.不用转换也可以循环!说明你对js或者jquery的某些操作不是很 ...
- 遍历器Iterator--指针对象
一. 什么是遍历器 1. 遍历器对象(Iterator) 遍历器对象本质上是一个指针对象,该对象有一个next方法,调用next方法返回一个 含有value和done属性的对象{value: val/ ...
随机推荐
- 转：LLVM与Clang的概述及关系
转:http://www.cnblogs.com/saintlas/p/5738739.html LLVM是构架编译器(compiler)的框架系统,以C++编写而成,用于优化以任意程序语言 ...
- zabbix主机自动发现
环境说明 角色 主机名 IP zabbix-server c1.heboan.com 192.168.88.1 zabbix-agent c2.heboan.com 192.168.88.2 zabb ...
- 【BZOJ 1150】 1150: [CTSC2007]数据备份Backup （贪心+优先队列+双向链表）
1150: [CTSC2007]数据备份Backup Description 你在一家 IT 公司为大型写字楼或办公楼(offices)的计算机数据做备份.然而数据备份的工作是枯燥乏味 的,因此你想设 ...
- 【BZOJ 1115】【POI 2009】石子游戏Kam
http://www.lydsy.com/JudgeOnline/problem.php?id=1115 差分后变成阶梯博弈. #include<cstdio> #include<c ...
- 【分块】【暴力】XVII Open Cup named after E.V. Pankratiev Grand Prix of Moscow Workshops, Sunday, April 23, 2017 Problem I. Rage Minimum Query
1000w的数组,一开始都是2^31-1,然后经过5*10^7次随机位置的随机修改,问你每次的全局最小值. 有效的随机修改的期望次数很少,只有当修改到的位置恰好是当前最小值的位置时才需要扫一下更新最小 ...
- 【递推】【组合数】【容斥原理】UVA - 11806 - Cheerleaders
http://www.cnblogs.com/khbcsu/p/4245943.html 本题如果直接枚举的话难度很大并且会无从下手.那么我们是否可以采取逆向思考的方法来解决问题呢?我们可以用总的情况 ...
- [NOIp2016提高组]天天爱跑步
题目大意: 有一棵n个点的树,每个点上有一个摄像头会在第w[i]秒拍照. 有m个人再树上跑,第i个人沿着s[i]到t[i]的路径跑,每秒钟跑一条边. 跑到t[i]的下一秒,人就会消失. 问每个摄像头会 ...
- 交换x,y的三种方式
1 值传递: #include<iostream> using namespace std; int main(){ void change(int ,int); int x=2,y=3; ...
- 20172333 2017-2018-2 《Java程序设计》第2周学习总结
20172333 2016-2017-2 <Java程序设计>第2周学习总结 教材学习内容总结 1.了解print与println的用法区别. 2.有关于"+"的基本用 ...
- centos下防火墙iptables日志学习笔记
一直找不到日志方面怎么弄,问了同事,同事给了个网址: http://www.thegeekstuff.com/2012/08/iptables-log-packets/ 下面就是我根据这个网址里面的设 ...