CODEWITHSUNDEEP
javascriptreactjs
Dev gobind Ganguly
Dev gobind Ganguly

Reputation: 13

App.js:69 Uncaught TypeError: Cannot read properties of undefined (reading 'setState')

Can anyone help me, I am getting this error "App.js:69 Uncaught TypeError: Cannot read properties of undefined (reading 'setState') at onInputChange (App.js:69:1)" Code Snippet

Upvotes: 0

Views: 488

Answers (2)

Shawn Yap
Shawn Yap

Reputation: 969

Few ways to go about this.

Since you're not using arrow function you need to bind your handlers

constructor() {
  ...code
  this.onInputChange = this.onInputChange.bind(this)
  this.onButtonSubmit = this.onInputChange.bind(this)
}

option 2 - switch your function to arrow function

onInputChange = (event) => {
  ...code
}

onButtonSubmit = () => {
  ...code
}

Here's a helpful post to help you understand why

https://www.freecodecamp.org/news/this-is-why-we-need-to-bind-event-handlers-in-class-components-in-react-f7ea1a6f93eb/

Upvotes: 1

cEeNiKc
cEeNiKc

Reputation: 1318

You can either change onInputChange method to use arrow function or you need to bind this for the onInputChange function.

Using arrow function:

onInputChange = (event) => {
  this.setState({ input: event.target.value });
};

Using bind:

<ImageLinkForm onInputChange={this.onInputChange.bind(this)} onButtonSubmit={this.onButtonSubmit.bind(this)} />

Upvotes: 0

Related Questions