React的onClick事件,加载页面的时候会自动执行,执行过后,onClick事件就实效,再点击就没有作用



  • 0_1480880704274_11111.png
    这个是绑定onClick事件的组件

    0_1480880727294_2222.png
    这是另外一个组件,在此组件里面,对上面绑定事件的组件循环保存进一个数组里面。

    0_1480880746627_QQ截图20161205034427.png
    这是打开页面的时候,自动执行了onClick后打印的组件索引,自动执行后,onClick就会实效,再点击,就没有作用。

    1.在网上看了好多,都是数循环的问题,因为值是正确的,觉得和this无关。
    2.后来我以为是onClick的绑定位置的原因,就换成了以上截图中的方式,还是会出现上面的情况。
    3.本人前几天才开始学习react,造成这种问题,应该是我自己编码的问题。
    4.希望前辈帮忙分析以下,谢谢



  • 因为你写错了

    正确的写法是

    onClick={() => this.某方法(某参数)}
    // 或者
    onClick={this.某方法.bind(this, 某参数)}
    

    而不是

    onClick={that.某方法(某参数)}
    

    后者在声明时就直接执行了(因而加载页面自动执行),执行后的返回值赋给了onClick属性(返回值必然不会是个函数,因而再点击没有作用)



  • @sunnylqm 啊啊啊~~ 我脑袋秀逗了,这么低级的错误。谢谢前辈提醒