Warum sollten JSX-Requisiten keine Pfeilfunktionen verwenden oder binden?

Ich verwende Lint mit meiner React-App und erhalte folgende Fehlermeldung:

error    JSX props should not use arrow functions        react/jsx-no-bind

nd hier starte ich die Pfeilfunktion (innerhalb vononClick):

{this.state.photos.map(tile => (
  <span key={tile.img}>
    <Checkbox
      defaultChecked={tile.checked}
      onCheck={() => this.selectPicture(tile)}
      style={{position: 'absolute', zIndex: 99, padding: 5, backgroundColor: 'rgba(255, 255, 255, 0.72)'}}
    />
    <GridTile
      title={tile.title}
      subtitle={<span>by <b>{tile.author}</b></span>}
      actionIcon={<IconButton onClick={() => this.handleDelete(tile)}><Delete color="white"/></IconButton>}
    >
      <img onClick={() => this.handleOpen(tile.img)} src={tile.img} style={{cursor: 'pointer'}}/>
    </GridTile>
  </span>
))}

Ist dies eine schlechte Praxis, die vermieden werden sollte? Und wie geht das am besten?

Antworten auf die Frage(10)

Ihre Antwort auf die Frage