<!DOCTYPE html>

<html lang="zh">

<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>在一个空间中同时循环数组和对象 / 同时循环两个数组</title>

</head>

<body>

	<div id="app">

		<!--循环对象和数组-->

		<div v-for="(item,key,index) in obj">

			<!--{{ key }} {{ index }}-->

			{{ arr[index].name }} {{ item }}

		</div>

		<!--循环两个数组-->

		<div v-for="(item, index) in arr">

			{{ item.name }}	{{ arrs[index].text }}

		</div>

		<!--循环两个对象 不可行-->

		<div v-for="(item,key,index) in obj">

			{{ item }} {{ objs[key].one }}

		</div>

	</div>

	<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>

	<script>

		var vm = new Vue({

			el:'#app',

			data:{

				arr:[

					{'name':'一秀'},

					{'name':'二举'},

					{'name':'三红'},

					{'name':'四进'}

				],

				arrs:[

					{'text':'自古多情'},

					{'text':'空余恨'},

					{'text':'此恨绵绵'},

					{'text':'无绝期'}

				],

				obj:{

					age:16,

					job:'web',

					eat:'黄焖鸡米饭',

					keyboard:'非机械'

				},

				objs:{

					one:'this is one',

					two:'this is two',

					three:'this is three',

					four:'this is four'

				}

			}

		})

	</script>

</body>

</html>

v-for同时循环一个对象和数组的更多相关文章

  1. php学习笔记：foreach循环访问关联数组里的值

    foreach循环可以将数组里的所有值都访问到,下面我们展示下,用foreach循环访问关联数组里的值. 例如: $fruit=array('apple'=>"苹果",'ba ...

  2. Java循环一个对象的所有属性，并通过反射给这些属性赋值/取值

    Java循环一个对象的所有属性,并通过反射给这些属性赋值/取值 说到循环遍历,最常见的遍历数组/列表.Map等.但是,在开发过程中,有时需要循环遍历一个对象的所有属性.遍历对象的属性该如何遍历呢?查了 ...

  3. java 在循环中删除数组元素

    在写代码中经常会遇到需要在数组循环中删除数组元素的情况,但删除会导致数组长度变化. package com.fortunedr.thirdReport; import java.util.ArrayL ...

  4. day05-java-（循环问题，数组）

    day05-java-(循环问题,数组) 1.三种循环结构的更佳适用情况:  1)while: "当..."循环  2)do...while: "直到..."循 ...

  5. JavaScript-//FOR/IN循环。当使用for/in循环遍历关联数组时，就可以清晰地体会到for/in的强大之处。

    <script> //FOR/IN循环.当使用for/in循环遍历关联数组时,就可以清晰地体会到for/in的强大之处. function getvalue(portfolio){ var ...

  6. JavaScript 中的常用12种循环遍历（数组或对象）的方法

    1.for 循环 let arr = [1,2,3]; for (let i=0; i<arr.length; i++){ console.log(i,arr[i]) } // 0 1 // 1 ...

  7. for 循环 和 Array 数组对象

    博客地址:https://ainyi.com/12 for 循环 和 Array 数组对象方法 for for-in for-of forEach效率比较 - 四种循环,遍历长度为 1000000 的 ...

  8. java _循环练习和数组练习

    练习 1.输出所有的水仙花数,所谓水仙花数是指一个数3位数,其每位数字立方和等于其本身,如153 = 1*1*1 + 3*3*3 + 5*5*5(很经典的题目) 分析: 通过观察发现,本题目要实现打印 ...

  9. C#不允许在foreach循环中改变数组或集合中元素的值（注：成员的值不受影响）

    C#不允许在foreach循环中改变数组或集合中元素的值(注:成员的值不受影响),如以下代码将无法通过编译. foreach (int x in myArray) { x++; //错误代码,因为改变 ...

随机推荐

  1. SQL Server - DISTINCT

    http://www.runoob.com/sql/sql-distinct.html 只选出不同的值,过滤掉重复的值.

  2. Spring Cloud Context模块

    SpringCloud这个框架本身是建立在SpringBoot基础之上的,所以使用SpringCloud的方式与SpringBoot相仿.也是通过类似如下代码进行启动. SpringApplicati ...

  3. filebeat_config

    Filebeat Prospector filebeat.prospectors: - input_type: log paths: - /var/log/apache/httpd-*.log doc ...

  4. jQuery ajaxForm和 ajaxSubmit注意

    http://jquery.malsup.com/form/#file-upload 在使用jQuery异步上传时,需要注意在存在文件上传时,要将返回数据的contentType设置为text/htm ...

  5. 结构体重载运算符&srand&rand

    先上代码,再按代码讲解 #include<stdio.h>#include<string.h>#include<stdlib.h>#include<time. ...

  6. python下的异常处理

    一.什么是异常 程序运行过程中错误发生的信号.(如果运行时产生的异常,程序不处理就会被抛出,随之会造成程序终止) 二.异常的种类 首先,异常主要分为语法错误.逻辑错误两种类型 语法错误会在程序还没有执 ...

  7. 字符串（2）KMP算法

    给你两个字符串a(len[a]=n),b(len[b]=m),问b是否是a的子串,并且统计b在a中的出现次数,如果我们枚举a从什么位置与匹配,并且验证是否匹配,那么时间复杂度O(nm), 而n和m的范 ...

  8. C# .Net 中字典Dictionary<TKey,TValue>泛型类 学习浅谈

    一.综述: Dictionary<TKey,TValue>是在 .NET Framework 2.0 版中是新增的.表示键值对的集合,Dictionary<TKey,TValue&g ...

  9. sklearn保存模型-【老鱼学sklearn】

    训练好了一个Model 以后总需要保存和再次预测, 所以保存和读取我们的sklearn model也是同样重要的一步. 比如,我们根据房源样本数据训练了一下房价模型,当用户输入自己的房子后,我们就需要 ...

  10. Stock Chase 拓扑

    题意 给出n个公司  m条信息 当某条信息构成环了  则这条信息是错误的 统计有多少个信息是错误的 这题是一条一条读入  虽然分在拓扑排序类里面 但是不会用拓扑排序来做 可以用floyd思想来做 如果 ...