初学react之事件监听

一、使用过vue的同学都会知道vue的事件绑定是非常简单的，但是react的事件绑定跟vue的差别有点大哦！接下来对比一下吧

// react的事件绑定
class Title extends Component {
  handleClickOnTitle () {
    console.log('Click on title.')
  }

  render () {
    return (
      <h1 onClick={this.handleClickOnTitle.bind(this)}>React 小书</h1>
    )
  }
}

// vue的事件绑定
 <h1 @click="handleClickOnTitle">React 小书</h1>
 
 methods：{
   handleClickOnTitle(){
    console.log('Click on title.')
   }
 }

我们可以看出react的事件绑定跟vue的写法是有很大的差别的，其中事件绑定要用到onClick,一定要用驼峰命名，为何呢？因为render函数在编译的时候会用一些机制去区分到底是js 方法 或者 css 还是 html标签，这样子才好编译。方法一定要用{}包裹，因为它是个变量来的哦，没有这个{}是会报错的。你学废了吗