1.map方法

注:map 返回的是一个新数组

class App extends Component {
// constructor(props) {
// super(props);
// this.state = {
// arr: ['aaa','bbb','ccc']
// };
// } state = {
arr: ['aaa','bbb','ccc']
} render() {
return (
<div>
{
this.state.arr.map(function(item,index) { // map 返回的是一个新数组
return <div className="app-item" key="index">{item}</div>
})
}
</div>
);
}
}

2.for 循环

var arr = ['111','222','333'];
var names = [];
for(var i=0; i<arr.length; i++){
names.push(<div key={i}>{arr[i]}</div>)
} ReactDOM.render(
<div>
{names}
</div>
, document.getElementById('root'));

.

react map 遍历的更多相关文章

  1. react.js map遍历的问题

    React遍历多个Ant Design中的Upload组件时,随意删除任一个Upload出现了bug,依次点击上传图片后,当点击删除时,倒着删除没有问题,从中间和从开头删问题出现了,出现了类似塌方的效 ...

  2. 应该用forEach改变数组的值吗? 原生JS forEach()和map()遍历的异同点

    应该用forEach改变数组的值吗? https://segmentfault.com/q/1010000013170900?utm_source=index-hottest 由于js中的数组是引用类 ...

  3. 分页查询和分页缓存查询,List<Map<String, Object>>遍历和Map遍历

    分页查询 String sql = "返回所有符合条件记录的待分页SQL语句"; int start = (page - 1) * limit + 1; int end = pag ...

  4. js中三个对数组操作的函数 indexOf()方法 filter筛选 forEach遍历 map遍历

     indexOf()方法  indexOf()方法返回在该数组中第一个找到的元素位置,如果它不存在则返回-1. 不使用indexOf时 var arr = ['apple','orange','pea ...

  5. map遍历的四种方式

    原文 http://blog.csdn.net/dayanxuqun/article/details/26348277 以下是map遍历的四种方式: // 一.推荐只用value的时候用,都懂的... ...

  6. 原生JS forEach()和map()遍历的区别以及兼容写法

    一.原生JS forEach()和map()遍历 共同点: 1.都是循环遍历数组中的每一项. 2.forEach() 和 map() 里面每一次执行匿名函数都支持3个参数:数组中的当前项item,当前 ...

  7. map遍历性能记录

    map遍历可以通过keySet或者entrySet方式. 性能上:entrySet略胜一筹,原因是keySet获取到key后再根据key去获取value,在查一遍,所以慢一些. keySet: //先 ...

  8. forEach() 和 map() 遍历

    1.forEach()   没有返回值. arr[].forEach(function(value,index,array){ //do something }) 参数:value数组中的当前项, i ...

  9. js的map遍历和array遍历

    1. array遍历: [1].forEach() forEach是ES5中操作数组的一种方法,主要功能是遍历数组.forEach方法中的function回调有三个参数:第一个参数是遍历的数组内容,第 ...

随机推荐

  1. day23 02 组合(继续人狗大战游戏)

    day23 02 组合(继续人狗大战游戏) 面向对象的三大特性:继承 多态 封装 先讲解一下组合 组合:一个对象的属性值是另一个类的对象:对象.属性.属性(一般有两个点) 继续扩展day22 01里面 ...

  2. DRF框架中的演变View

    import json from django.db import DatabaseError from django.http import HttpResponse from django.htt ...

  3. Codeforces Round #877 (Div. 2) D. Olya and Energy Drinks

    题目链接:http://codeforces.com/contest/877/problem/D D. Olya and Energy Drinks time limit per test2 seco ...

  4. yum安装的java配置

    vim /etc/profile JAVA_HOME=/usr/lib/jvm/javaJRE_HOME=$JAVA_HOME/jreCLASS_PATH=.:$JAVA_HOME/lib/dt.ja ...

  5. 关于Linux下的环境变量

    一.交互式shell和非交互式shell 要搞清bashrc与profile的区别,首先要弄明白什么是交互式shell和非交互式shell,什么是login shell 和non-login shel ...

  6. search Paths $(SRCROOT)和$(PROJECT_DIR)区别

    $(SRCROOT)代表的时项目根目录下 $(PROJECT_DIR)代表的是整个项目 PS:往项目添加文件时,例如.a等,要先showinfinder ,复制到项目中,然后再拖到xcode项目中

  7. 给定一颗二叉搜索树,请找出其中的第k大的结点。例如, 5 / \ 3 7 /\ /\ 2 4 6 8 中,按结点数值大小顺序第三个结点的值为4。

    /* struct TreeNode { int val; struct TreeNode *left; struct TreeNode *right; TreeNode(int x) : val(x ...

  8. Python之转换py文件为无需依赖python环境的exe文件的方法

    在日常工作中,使用python脚本开发快速敏捷,但是其代码是可见的,而且充分的依赖python开发环境.为了达到保护我们源码的目的,或者不依赖python开发环境使用python脚本,将其转换成可以直 ...

  9. 【Luogu】P3052摩天大楼里的奶牛(状压DP)

    参见ZHT467的题解. f[i]表示在i这个集合下的最少分组数和当前组最少的容量. 从1到(1<<n)-1枚举i,对于每个i枚举它的子奶牛,然后重载运算符计算. 代码如下 #includ ...

  10. BZOJ2244 [SDOI2011]拦截导弹 【cdq分治 + 树状数组】

    题目 某国为了防御敌国的导弹袭击,发展出一种导弹拦截系统.但是这种导弹拦截系统有一个缺陷:虽然它的第一发炮弹能够到达任意的高度.并且能够拦截任意速度的导弹,但是以后每一发炮弹都不能高于前一发的高度,其 ...