Skip to content

Instantly share code, notes, and snippets.

@3nvi
Created February 27, 2019 22:05
Show Gist options
  • Save 3nvi/dd0c343d182ac3c3b824870cab311241 to your computer and use it in GitHub Desktop.
Save 3nvi/dd0c343d182ac3c3b824870cab311241 to your computer and use it in GitHub Desktop.
Minimize anonymous function props
// Don't do this!
function Component(props) {
return <AnotherComponent onChange={() => props.callback(props.id)} />
}
// Do this instead :)
function Component(props) {
const handleChange = useCallback(() => props.callback(props.id), [props.id]);
return <AnotherComponent onChange={handleChange} />
}
// Or this for class-based components :)
class Component extends React.Component {
handleChange = () => {
this.props.callback(this.props.id)
}
render() {
return <AnotherComponent onChange={this.handleChange} />
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment