CODEWITHSUNDEEP
javascriptreactjsreact-native
Conn Breathnach
Conn Breathnach

Reputation: 41

React Native Touchable Opacity functions

I have two functions in my React Native app, and I need my TouchableOpacity to call both when pressed. To do so I tried to simply use an arrow function in the onPress method with both functions inside, but this doesn't work. I assume it's something to do with scope, but I'm not sure. Both functions work correctly when simply passed into the onPress method alone. Here's the code (I've trimmed it a lot for readability) Please help.

export class CreateItem extends React.Component {
constructor(props){
    super(props);
}

sendData = () => {
    itemData = this.state.item;
    this.props.action(itemData); //the action function alters the parent state (this function works fine every other time)
}
render(){
return(
    <TouchableOpacity
    onPress={() => {
    this.sendData;
    this.props.hide; //This function is passed from the parent and works fine in other scenarios 
    }}
    >
        <Text>Add Item</Text>
    </TouchableOpacity>
)
}

Upvotes: 1

Views: 1642

Answers (1)

Sadegh Teimouri
Sadegh Teimouri

Reputation: 1478

you missed the parentheses of functions

export class CreateItem extends React.Component {
constructor(props){
    super(props);
}

sendData = () => {
    itemData = this.state.item;
    this.props.action(itemData); //the action function alters the parent state (this function works fine every other time)
}
render(){
    return(
        <TouchableOpacity
            onPress={() => {
                this.sendData();
                this.props.hide(); //This function is passed from the parent and works fine in other scenarios 
            }}
        >
            <Text>Add Item</Text>
        </TouchableOpacity>
    )
}

Upvotes: 2

Related Questions