CODEWITHSUNDEEP
javascriptreactjseventsdom-events
nickornotto
nickornotto

Reputation: 2146

Reactjs function "is not a function"

I am trying to use an additional function on submit as I usually did but it shows it's not a function.

confirmSubmission = () => { // This doesn't work either: confirmSubmission() {
    //doSomething();
}

onSubmission(survey, options) {
    this.confirmSubmission(); // here it says Uncaught error: confirmSubmission is not a function
}

The function I used:

return (<MyCOmponent model={model} onComplete={this.onSubmission}/>);

Other code that I have within onComplete executes fine if confirmSubmission is not there.

I have a similar code with another function which works perfectly fine in the same component:

componentDidMount() {
    this.loadData(); // This works
}

loadData() {
    doSomething();
}

I am confused why it doesn't like the confirmSubmission call. Any ideas?

Upvotes: 0

Views: 220

Answers (2)

Mahmoud K
Mahmoud K

Reputation: 85

Try replacing

onSubmission(survey, options)

with an arrow function, it's the famous "this" issue

Upvotes: 2

hgb123
hgb123

Reputation: 14881

You must have forgotten to bind the this context to onSubmission

constructor(/*...*/) {
  //..
  this.onSubmission = this.onSubmission.bind(this)
}

or

return (<MyCOmponent model={model} onComplete={this.onSubmission.bind(this)}/>);

Upvotes: 0

Related Questions