Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

React Native Button onPress function example

What is the difference between using the two and when should I use one over the other

<Button onPress={this.refreshData}>
<Button onPress={()=>this.refreshData()}>
like image 876
Jerry seigle Avatar asked Apr 09 '26 02:04

Jerry seigle


2 Answers

You should do this if you don't need to pass an argument to your function :

<Button onPress={this.refreshData}>

Doing this <Button onPress={()=>this.refreshData()}> may break optimizations.
From React doc:

Using an arrow function in render creates a new function each time the component renders, which may break optimizations based on strict identity comparison.

like image 119
Ibra Avatar answered Apr 11 '26 22:04

Ibra


Here is an extract from React Docs.

You can use an arrow function to wrap around an event handler and pass parameters:

<button onClick={() => this.handleClick(id)} />

This is equivalent to calling .bind:

<button onClick={this.handleClick.bind(this, id)} />

https://reactjs.org/docs/faq-functions.html

like image 25
flakerimi Avatar answered Apr 11 '26 21:04

flakerimi



Donate For Us

If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!