react2 react 遍历数组
<body>
<!-- React 真实 DOM 将会插入到这里 -->
<div id="example"></div>
<!-- 引入 React -->
<script src="src/libs/react.js"></script>
<!-- 引入 JSX 语法格式转换器 -->
<script src="src/libs/JSXTransformer.js"></script>
<script src="src/libs/jquery.js"></script>
<!-- 注意:script 需要注明 type 为 text/jsx 以指定这是一个 JSX 语法格式 -->
<script type="text/jsx">
var arr = ['篮球','足球','乒乓球'];
React.render(
<div>
{
arr.map(function(name){
return <div>{name}</div>
})
}
</div>,
document.getElementById("example")
)
</script>
</body>
<body>
<!-- React 真实 DOM 将会插入到这里 -->
<div id="example"></div>
<!-- 引入 React -->
<script src="src/libs/react.js"></script>
<!-- 引入 JSX 语法格式转换器 -->
<script src="src/libs/JSXTransformer.js"></script>
<script src="src/libs/jquery.js"></script>
<!-- 注意:script 需要注明 type 为 text/jsx 以指定这是一个 JSX 语法格式 -->
<script type="text/jsx">
var arr = ['篮球','足球','乒乓球'];
React.render(
<div>
{arr}
</div>,
document.getElementById("example")
)
</script>
</body>
上面代码的arr变量是一个数组,结果JSX会把它的所有成员,添加到模板
react2 react 遍历数组的更多相关文章
- 利用React遍历数组,并且用数组的元素生成<li>arrItem</li>标签组
var numbers = [1,2,3,4,5,6,7,8,9]; ReactDom.render({ <ul> { numbers.map(function(item){ return ...
- *使用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 ...
- 以forin的方式遍历数组时进行删除操作的注意点
今天在修改某项需求的时候,需要在遍历的时候将匹配项移除掉,采用的时forin的方式遍历,然后运行的时候却crash掉了 for (NSString*str in self.btnArray) { if ...
- 使用for循环遍历数组
package review20140419;/* * 遍历数组 */public abstract class Test1 { //程序入口 public static void mai ...
- php 中遍历数组时使用引用出现的问题
今天在使用foreach遍历数组时发现,当使用&时会出现问题: $arr = array( array('id' => 100, 'error'=> 'aa'), array('i ...
- Java:JSTL遍历数组,List,Set,Map
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding= ...
随机推荐
- Word 2007 文档结构图混乱
Word 2007在编写大型文档时经常出现文档结构图混乱的情况,经过多番检索试验,得出结论: 绝对有效的临时性解决方案:在打开word的时候左下角会有提示word自动更新文档样式,按esc键取消,然后 ...
- 自话自说——POI使用需要注意一个地方
2015.12.1 天气 不怎么好 心情跟天气一样.知道为什么吗,因为昨晚一晚没睡你懂吗... 今天在用POI操作excel的时候,遇到了一个很恶心的地方,这个地方真的有那种让我不相信编程的感觉 ...
- [LeetCode]447 Number of Boomerangs
Given n points in the plane that are all pairwise distinct, a "boomerang" is a tuple of po ...
- easyconf——基于AugularJS的配置管理系统开发框架
目录 1 easyconf的诞生2 easyconf的设计理念 2.1 总体设计 2.2 细节设计 2.2.1 CRUD操作 2.2.2 即时校验 2.2.3 下拉框设计3 easyconf使用指南 ...
- 敏捷开发方法-Scrum
为了不落后他人,于是我也开始学习Scrum,今天主要是对我最近阅读的相关资料,根据自己的理解,用自己的话来讲述Scrum中的各个环节,主要目的有两个,一个是进行知识的总结,另外一个是觉得网上很多学习资 ...
- 企业搜索引擎开发之连接器connector(二十九)
在哪里调用监控器管理对象snapshotRepositoryMonitorManager的start方法及stop方法,然后又在哪里调用CheckpointAndChangeQueue对象的resum ...
- win server服务安装
从一台机子的服务移到我的测试环境中: 1.copy 100pC上的服务目录(d:\...)到13PC中
- 甲乙(数理逻辑)转自http://www.cnblogs.com/devymex/p/3329635.html
这是一道历史悠久,又很困难的面试题. 你在旁观主持人和甲.乙两个天才数学家玩猜数字游戏.主持人准备了两个数,告知甲乙:这两个数不同,且大于等于1,小于等于30.然后主持人将两数之积告诉甲,把两数之和告 ...
- web
1.linux下交换文件 .index.php.swp 有时可查看源码2.当php后缀被过滤的时候可以直接对ph开头的后缀进行一个fuzz测试可以上传的文件后缀名3.curl -x 123.45.67 ...
- hdu 5720
考虑三个树枝:a,b,c若c是将要抛出的树枝,那么形成三角形的条件是a+b>c and a-b<c 可以写成 c属于开区间(a-b,a+b)对于每个C和许许多多的其他边,如何保证C不构成三 ...