react事件处理函数传参的问题

Question

之前看了很多关于如何绑定事件处理函数中this的问题，性能最好的应该是在constructor中用bind绑定this，但是现在我在里面绑定过this之后，在标签上使用的时候 需要传递参数 应该怎么办呢？
如果外层用箭头函数包裹，那我直接用箭头函数包裹就行了，一举两得，既可用把this问题解决了，我又可以给函数传入参数，就没必要在constructor中用bind了啊，还是说正常使用的过程中都是两者交替使用？请大佬解惑

Answer 1

一般我们倾向于可以正常使用又能避免性能问题的做法

1.对于 this undefined 的问题，我们可以使用bind this或者是箭头函数。这两种方法可以均使得程序正常运行

2.哪种更好？

• 性能问题究竟是啥？

//这种产生的性能问题是，每次渲染都会重新创建一个箭头函数
<button onClick={()=>this.handleClick}>Click</button>

所以更多的是倾向于保持对于函数的引用，避免重复创建

{
    items.map( item =>
        <button onClick={() => this.hey(item.id)}>Click</button>
    )
}
//↓↓↓

const Item = ( props ) => {
    const handleClick = () => props.hey( props.item.id );
    return (
        <button onClick={handleClick}>Click</button>
    );
}

但是显然我们的程序变得难看复杂了，所以我们仍然可以使用另一种方式

class A extends React.Component {
  state = {name: this.props.name}
   hey = (event) => {
    console.log(this.state.name)
  }
  render() {
    return (
       <button onclick={this.hey} />
    )
  }
}

如果你不需要传递参数，那么直接在construtor中bind this就行了。
以上，我个人更多的是基于习惯去使用
甚至会考虑心的语法规范，例如

this.handleClick= ::this.handleClick