react 方法bind绑定 方案以及箭头函数解决方案

• 常规

class Foo extends React.Component{
  constructor( props ){
    super( props );
    this.handleClick = this.handleClick.bind(this); // bind绑定
  }
  handleClick(event){
    // todo something
  }
  render(){
    return (
      <button type="button" onClick={this.handleClick}>
        Click Me
      </button>
    );
  }
}

• 箭头函数解决

class Foo extends React.Component{
  handleClick = () => {  // 
    console.log(this); 
  }

  render(){
    return (
      <button type="button" onClick={this.handleClick}>
        Click Me
      </button>
    );
  }
}

class Foo extends React.Component{
  handleClick(event) {
    console.log(this); 
  }

  render(){
    return (
      <button type="button" onClick={(e) => this.handleClick(e)}>
        Click Me
      </button>
    );
  }
}