score:1

Accepted answer

It has to do with the scope of this when you use an arrow function this will be scoped to the component class and not the function itself. So if you want to use a normal function you will need to bind the function in your react components constructor like this.fetchSearchImagesBound = this.fetchSearchImages.bind(this)

score:0

you are setStateing the state variable, you need to bind that method(this.fetchSearchImages.bind(this)) or use arrow function

score:0

In your first code:

fetchSearchImages = () => {
const { searchStart, count, term, searchImages } = this.state;
this.setState({
  searchStart: searchStart + count
});

Here "this" refers to this of function fetchSearchImages, not your component's this.

When you do this:

fetchSearchImages = () => {
const { searchStart, count, term, searchImages } = this.state;
this.setState({
  searchStart: searchStart + count
});

HEre "this" refers to "this" of your component because arrow function does not have it's own "this". That's why you have to use arrow function to access "this"


Related Query

More Query from same tag