Why shouldn't JSX props use arrow functions or bind?

Question

I\'m running lint with my React app, and I receive this error:

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

A

Answer 1

You can use arrow functions using react-cached-handler library, no need to be worried about re-rendering performance :

Note : Internally it caches your arrow functions by the specified key, no need to be worried about re-rendering!

render() {

  return 

  {
        this.props.photos.map(photo=>
           { 
                 console.log(url) })}
          />)
   }
 

}

Other features:

• Named handlers
• Handle events by arrow functions
• Access to the key, custom arguments and the original event
• Component rendering performace
• Custom context for handlers