首页 > React在循环中为什么不能监听点击事件了?

React在循环中为什么不能监听点击事件了?

不知道为什么,自己写了一个组件需要循环输出然后监听点击事件拿到点击的值,但是onClick事件再循环后就不起作用了

var Item = React.createClass({
    select:function(){
        alert('aa')
    },
    render:function(){
        return <div>
            {this.props.data.map(function(item){
                return <div onClick={this.select}>{item}</div>
            })}
        </div>
    }
})
React.render(<Item data={[12,3,12]},$('.J_hook'))

还有,如何完成点击页面的其它元素让这个itemlist隐藏,给个思路就行


因为在map中的函数的this指向变了,在map函数的第二个参数将this传入就可以了。


this问题,你可以改成这样

{this.props.data.map(function(item){
    return <div onClick={this.select}>{item}</div>
}.bind(this))}

补充

render:function(){
    var self=this;
    return <div>
        {this.props.data.map(function(item){
            return <div onClick={self.select}>{item}</div>
        })}
    </div>
}
【热门文章】
【热门文章】