事件绑定

react中的事件绑定与原生DOM类似
on+事件名={执行函数} 注意驼峰命名

  1. // 函数组件绑定事件
  2. const Hai =()=>{
  3.   function handerHai(){
  4.       console.log('hai~')
  5.   }
  7.     return (<button onClick={handerHai}>嗨</button>)
  8. }
  11. // 类组件绑定事件
  12. class Hai extends React.Component{
  14.   handerHai(){
  15.       console.log('hai~')
  16.   }
  18.     render(){
  19.       return (<button onClick={this.handerHai}>嗨</button>)
  20.   }
  21. }

事件对象

又称为合成事件

  1. // e 为事件对象参数
  2. // 通过 e.preventDefault 可以阻止浏览器的默认行为
  3. const Hai =()=>{
  4.   function handerHai(e){
  5.       console.log('hai~',e)
  6.   }
  8.     return (<button onClick={handerHai}>嗨</button>)
  9. }