vue - for遍历数组
注释上,也很清楚了哈.
1. item是循环名字,items是循环的数组
<!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">
<!-- item是循环名字,items是循环的数组 -->
<div v-for="item in items">
{{item}}
</div>
</div> <script type="text/javascript">
var app = new Vue({
el: '#app',
data: {
message: 'hello World!',
items:[10,2,3,4,5]
}
})
</script>
</body> </html>
vue - for遍历数组的更多相关文章
- Vue中遍历数组的新方法
1.foreach foreach循环对不能使用return来停止循环 search(keyword){ var newList = [] this.urls.forEach(item =>{ ...
- 【VUE】vue中遍历数组和对象
一.遍历对象 对象数据 cities:{ "A":[{ "id": 56, "spell": "aba", " ...
- vue遍历数组和对象的方法以及他们之间的区别
前言:vue不能直接通过下标的形式来添加数据,vue也不能直接向对象中插值,因为那样即使能插入值,页面也不会重新渲染数据 一,vue遍历数组 1,使用vue数组变异方法 pop() 删除数组最后一 ...
- Vue基础学习 --- 遍历数组
<body> <div id="app"> <ul> <!-- 遍历数组 --> <li v-for="user i ...
- vue_v-for_遍历数组_遍历对象
1. v-for 遍历数组 html <div id="test"> <ul> <li v-for="(p, index) in perso ...
- *使用while循环遍历数组创建索引和自增索引值
package com.chongrui.test;/* *使用while循环遍历数组 * * * */public class test { public static void main ...
- nodejs 遍历数组的两种方法
var array = [1,2,3]; array.forEach(function(v,i,a){ console.log(v); console.log(i); console.log(a); ...
- 原生js使用forEach()与jquery使用each遍历数组,return false 的区别
原生js使用forEach()与jquery使用each()遍历数组,return false 的区别: 1.使用each()遍历数组a,如下: var a=[20,21,22,23,24]; $.e ...
- js中数组遍历for与for in区别(强烈建议不要使用for in遍历数组)
js中遍历数组的有两种方式 var array=['a'] //标准的for循环 for(var i=1;i<array.length;i++){ alert(array[i]) } //for ...
随机推荐
- ZSTU OJ 4273 玩具
枚举,二分,$RMQ$. 肯定是将连续一段中最大值免去花费,枚举起点之后,二分终点即可.可以证明单调性. #include<map> #include<set> #includ ...
- 安装 SQL Server 2008 和管理工具 SQL Server 2008 management studio 及相关问题解决
Sql Server 2008 问题小总结 http://www.lihengyu.com/blog/4877.html 安装 SQL Server 2008 和管理工具 SQL Server 200 ...
- Redux 源码自己写了一遍
<!DOCTYPE HTML> <html> <head> <meta http-equiv="content-type" content ...
- 【Kruskal】舒适的路线
[codevs1001]舒适的路线 题目描述 Description Z小镇是一个景色宜人的地方,吸引来自各地的观光客来此旅游观光.Z小镇附近共有N(1<N≤500)个景点(编号为1,2,3,… ...
- BZOJ 1700 [Usaco2007 Jan]Problem Solving 解题(单调DP)
[题目链接] http://www.lydsy.com/JudgeOnline/problem.php?id=1700 [题目大意] 共有p道题目要做,每个月收入只有n元,用于付钱做题之外的部分都会吃 ...
- Problem X: 双层金字塔
#include<stdio.h> int main() { int i,j,n,m; while(scanf("%d",&n)!=EOF) { ;i<= ...
- Integer引用类型问题
public class TestMain { public static void main(String[] args) { Integer integer = 2; go(2); System. ...
- Eclipse、svn插件、subclipse的安装
1.下载subclipse的安装包 URL:http://subclipse.tigris.org/servlets/ProjectDocumentList?folderID=2240 ...
- HDU 2389 Rain on your Parade(二分匹配,Hopcroft-Carp算法)
Rain on your Parade Time Limit: 6000/3000 MS (Java/Others) Memory Limit: 655350/165535 K (Java/Ot ...
- linux安装配置redis
redis是支持linux的,所以linux安装redis非常简单,按照官网的提示操作即可. 下载 $ wget http://download.redis.io/releases/redis-3.2 ...