(SOLVED) React pass arguments to parent component function

I’m needing to pass a function to a child, which I can do, but then trying to send that function an argument from the child isn’t working.

Heres my parent function and child call:

inputMade(val) {
    let currentInput = this.state.input + val;
      input: currentInput
<CalcButtons returnValue={this.inputMade}/>

And here is my trying to call the function with an argument from the child component:

<button onClick={this.props.returnValue("1")}>1</button>

When deleting the argument and parentheses, the code renders (but obviously doesn’t work as intended) but with the argument it breaks.

While continuing research I found through the React website you have to treat it as a function. So in ES6:

<button onClick={() => this.props.returnValue(1)}>1</button>

and it works now. Thanks :smiley:

You could have also used bind to pass the extra argument.

<button onClick={this.props.returnValue.bind(null,1)}>1</button>
1 Like