将函数绑定到组件React es6的不同​​方法是什么

Question

我有一个像示例中的组件

class ItemBox extends Component {

  constructor(props){
    super(props);
    this.someFn = this.someFn.bind(this);
  }

  someFn(){
    console.log(this)
  }

  render(){
    return (
      <div onClick={this.someFn}>bla<div/>
    )
  }
};

我想问一下 - 是否有某种不同的解决方案将功能绑定到组件，除了我在构造函数中使用（从文档中读取）。因为我可以有100个函数，我将传递给子组件或在此组件中使用等等。

Answer 1

你可以这样做......

class ItemBox extends Component {

  someFn = ()=>{
    console.log(this)
  }
  constructor(props){
    super(props);
  }

  render(){
    return (
      <div onClick={this.someFn}>bla<div/>
    )
  }
};

Answer 2

我通常这样做：

class SomeComponent extends Component {
    _handleClick = () => {
         console.log(this)
    }
    render() {
        return (
            <div onClick={this._handleClick}>bla</div>
        )
    } 
}