[小知识点] react 性能

// 在html中，使用箭头函数，自动绑定this
class SearchHistory extends React.Component {

    render(){
     return(
   　　　　　　<Button type=‘primary‘ appearance=‘link‘ onClick={() => { this.clickEye(a,item) }} > // 这里是箭头函数，写在了jsx中
              　　<Icon name=‘eye‘ style={successIcon} />
              查看</Button>
　　　　)
    }
}
// 这样做的缺点是，每次走render函数时候，都会执行这个箭头函数，当把这个函数作为props传给子组件时候，则子组件每次都会拿到新的props，如果特别在意性能，就尽量少用这种方法。

// 在构造器中绑定this
class SearchHistory extends React.Component {
    constructor (props) {
      super(props)
      this.clickEye = this.clickEye.bind(this)
    }

     clickEye(a,b){
        // do something.....
     }
    render(){
     return(
   　　　　　　<Button type=‘primary‘ appearance=‘link‘ onClick={ this.clickEye } > // 这里不是箭头函数
              　　<Icon name=‘eye‘ style={successIcon} />
              查看</Button>
　　　　)
    }
}
// 这样做的缺点是，如果有很多方法，则构造器中需要写很多，只为了绑定this。

// 在写函数时候，使用箭头函数，自动绑定当前this
class SearchHistory extends React.Component {
  constructor (props) {
    super(props) // 没有在这里绑定
  }
  clickEye = () => { // 这是个箭头函数，自动绑定了当前this。
    // do something...
  }
  
  render(){
    return(
            <Button type=‘primary‘ appearance=‘link‘ onClick={ this.clickEye } >
              <Icon name=‘eye‘ style={successIcon} />
            查看</Button>
     )
  }
}
// 这样做的缺点是，参数可以拿到event，但是传其他参数，就需要使用bind传参，比较麻烦