最近看了一篇文章
http://www.tuicool.com/articles/Ejmu63
说的是在使用react中，经常用到react的map函数，用法和jquery里中的map一样，但是，如果你在每个map出来的元素中添加，你会发觉添加的事件无法关联，于是自己写了一个例子，发现不存在这个问题，通过map和返回数组的方式都可以正常的执行事件
1.通过map的方式
var R_Result = React.createClass({
showDetail:function(url){
window.open(url);
},
render:function(){
var o = this;
var list = this.props.date.map(function(c){
return(
<li onClick={o.showDetail.bind(this,c.txtUrl)}>
<h1><span className="am-badge am-badge-success am-radius ">{c.txtSource}</span>{c.title}</h1>
<span className="price am-badge am-badge-warning am-radius ">{c.numPrice}</span>
</li>
);
});
return(
<div id="result">
<ul className="am-list">
{list}
</ul>
</div>
);
}
});
2.通过返回数组的方式
var R_Result = React.createClass({
showDetail:function(item,item1){
window.open(item);
},
render:function(){
var o = this;
var arr1 = this.props.date;
var newArry=[];
for(var i=0;i<arr1.length;i++){
var item = arr1[i].txtUrl;
newArry.push(
<li onClick={this.showDetail.bind(this.item,item)}>
<h1><span className="am-badge am-badge-success am-radius ">{arr1[i].txtSource}</span>{arr1[i].title}</h1>
<span className="price am-badge am-badge-warning am-radius ">{arr1[i].numPrice}</span>
</li>
)
}
return(
<div id="result">
<ul className="am-list">
{newArry}
</ul>
</div>
);
}
});
