React中事件分类
React中事件绑定分为两种：
1.直接添加在React元素上的事件，这是React在基于Virtual DOM的基础上实现的符合w3c规范的合成事件(SyntheticEvent)，这种情况下React内部会在组件销毁前自行对事件进行解绑；
2.JS原生事件事件（利用ref获取原生元素），这种情况下需要我们手动对事件进行解绑。
本文主要对第二种情况进行介绍。
React中何时进行事件绑定与解绑
事件绑定在React的componentDidMount生命周期函数中进行，解绑在componentWillUnmount生命周期函数中进行。
为什么要解除绑定的事件
一般来说事件解绑为了节约内存或者防止内存泄漏，或者业务逻辑的需要。
React中事件处理需要注意的事项
1.不要把原生事件和React的合成事件混淆在一起使用，详情看这篇文章 https://segmentfault.com/a/1190000008782645 （这篇文章有个错误点要注意，removeEventListener的第二个参数是必须的，不能不传，这跟jQuery的事件解绑是不同的！！！）。
2.使用addEventListener进行事件绑定的时候不要传入匿名函数作为回调，因为你绑定和解绑的时候看起来一样的匿名函数其实不是一个，它们的地址是不同的，这是一个很容易踩的坑。
class Demo extends React.Component{
constructor(props){
super(props);
this.state = {
visible : true
}
this.handleClick = this.handleClick.bind(this); //绑定和解绑的回调函数是实例的同一个方法
}
componentDidMount(){
document.body.addEventListener('click', this.handleClick); //如果在这里绑定回调函数的this指向，其实就产生了传入匿名函数作为回调一样的问题
}
componentWillUnmount(){
document.body.removeEventListener('click', this.handleClick); //如果在这里绑定回调函数的this指向，其实就产生了传入匿名函数作为回调一样的问题
}
handleClick(){
this.setState((prevState, props) =>{
visible : !prevState.visible
})
}
render(
...此处省略
)
}