React中绑定事件

首先来看一个很简单的例子：

<button onClick={function() { console.log('Hello') } }>按钮</button>

这样写是没问题的，可以注意到，点击事件onClick的写法，其中的c是大写，如果改为了onclick，则会无效，因为react有一套自己的事件绑定机制，不同于原生JS，其事件名是小驼峰命名。
如果将函数置于外部，增强其可复用性，则有两种引用方式：

1. 普通引用，代码如下：

<button onClick={this.myclickHandler}>按钮</button>

 myclickHandler(){
        console.log("Hello World!");
    }

需要注意的是，与事件绑定的必须是一个函数，因此这里的引用是不能后加上括号的，如果加上之后this.myclickHandler()当解析到该事件时，就被立即执行，不会经过点击事件的触发，这显然不是我们想要的结果。
2. 箭头函数，代码如下：

<button onClick={()=>{this.myclickHandler()}}>按钮</button> 

 myclickHandler(){
        console.log("Hello World!");
    }

总体来说，还是很推荐第二种箭头函数的写法。
既然是函数，那么一定可以进行传参，例如下面这段代码：

<button onClick = {()=>this.show('Hello,', 'World!')}>按钮啊</button>

  show = (item1, item2) => {
        console.log('show方法已被调用了'+item1+item2);
        }

结果是没问题的：