I´m getting this error Error fetching and parsing data TypeError: _this2.setState is not a function, when using Fetch

Question

performSearch(query) {
    console.log(https://api.giphy.com/v1/gifs/search?q=${query}&limit=24&api_key=dc6zaTOxFJmzC);
    fetch(https://api.giphy.com/v1/gifs/search?q=${query}&limit=24&api_key=dc6zaTOxFJmzC)
      .then(response => response.json())
      .then(responseData => {
        this.setState({ gifs: responseData.data })
      })
      .catch(error => {
        console.log('Error fetching and parsing data', error);
      });
  }

Dom Ss · Answer

Hey Rick, 
A long-shot but I made a similar mistake. When you declare performSearch function in the App.js, make sure it has the proper syntax of an arrow function. Maybe it helps some1. ;)

Mark Westerweel · Answer

Rick is correct. I had the same issue. 
found the solution on stack (https://stackoverflow.com/questions/31045716/react-this-setstate-is-not-a-function)
performSearch needs to be written like:

performSearch = (query ) => {
    axios.get(`http://api.giphy.com/v1/gifs/search?q=${query}&api_key=QGx0HYKQgMVMrdvG8nly3aQfAAVUi7q7&limit=24`)
  .then(response => {
    this.setState( { 
      gifs: response.data.data});  
  })
  .catch((error) => {
    console.log('Error fetching and passing data', error)
    });
  }

If the function is not defined as a arrow function, you would need to .bind() "this" like

this._handleDelete = this._handleDelete.bind(this);

To avoid it all together, just use the proper arrow function syntax.
I guess you get _this2 becaue it's the second time ''this" pops up in your code. It was the 3rd time in mine and got the _this3

Steven Parker · Answer

There's no "_this2" defined or referenced in this code, but without Markdown formatting (https://teamtreehouse.com/library/code), we may not be seeing it correctly.
A link to a workspace snapshot (https://teamtreehouse.com/library/previews-and-snapshots) would make replication of the issue far easier.

Welcome to the Treehouse Community

Looking to learn something new?

Rick Varela

Rick Varela

I´m getting this error Error fetching and parsing data TypeError: _this2.setState is not a function, when using Fetch

3 Answers

Dom Ss

Dom Ss

Mark Westerweel

Mark Westerweel

Steven Parker

Steven Parker