How to call for more than one functions in onPress prop?

Question

I've had a function such as

const functionOne = parameterOne => {
 [...]
}

called in a TouchableOpacity's onPress prop like this:

[...] onPress={functionOne.bind(this, 'text')} [...]

and it worked.

On another component, I have a function such as

const functionTwo = parameterTwo => {
 [...]
}

which I pass to the component that has the first function via props. Something like this:

<MiddleComponent onChange={functionTwo} />

<FunctionOneComponent onChange={props.onChange} />

and on the onPress, I call the function like this:

[...] onPress={props.onChange.bind(this, value)} [...]

which also works just fine.

The problem is, I'm not figuring out how to call both functions on the same onPress. I've read this solution but I wasn't able to figure out how to adapt it to my code. I tried

onPress{() => { functionOne.bind(this, 'text'); props.onChange.bind(this, value);}}

which makes neither function work, and several other syntax ideas, such as

onPress{() => { this.functionOne.bind(this, 'text'); this.props.onChange.bind(this, value);}}

which led to errors. Now, I understand I'm not seeing the solution because I don't understand the details of what "this" is, but searching for that myself also didn't lead to any better understanding, so I've decided to seek help.

Answer 1

Function.prototype.bind() returns function rather than call one. Instead of using .bind() to pass the text to the button you could do this:

onPress={() => functionOne(text)}

In this syntax, you can call two functions like so:

onPress={() => { functionOne(text); props.onChange(value); } }