close

[Solved] TypeError: results.map is not a function in Reactjs

Hello Guys, How are you all? Hope You all Are Fine. Today I get the following error TypeError: results.map is not a function in Reactjs. So Here I am Explain to you all the possible solutions here.

Without wasting your time, Let’s start This Article to Solve This Error.

How To Solve TypeError: results.map is not a function in Reactjs Error ?

  1. How To Solve TypeError: results.map is not a function in Reactjs Error?

    To Solve TypeError: results.map is not a function in Reactjs Error Function map() can be used only on the array. In this situation, it looks like props.results are not an array or have not been set yet. I would recommend you to place something like this at the start of the function. if (!props.results) return 'no data';

  2. TypeError: results.map is not a function in Reactjs

    To Solve TypeError: results.map is not a function in Reactjs Error Function map() can be used only on the array. In this situation, it looks like props.results are not an array or have not been set yet. I would recommend you to place something like this at the start of the function. if (!props.results) return 'no data';

Solution 1

Function map() can be used only on the array. In this situation, it looks like props.results is not an array or have not been set yet (this can happen if you are fetching data with Axios or something like that).

I would recommend you to place something like this at the start of the function:

if (!props.results) return 'no data';
if (!Array.isArray(props.results)) return 'results are not array'

Solution 2

You get a response on your onreadystatechange the request which usually comes in JSON or XML. I think your answer is stringified JSON. Try to use JSON.parse(response) in case of JSON or (new DOMParser()).parseFromString(response,”text/xml”) in the case of XML.

In your component, it may look like this

request.onreadystatechange = function() {
   (this.readyState == 4 && this.status == 200)
      && setAnswer([JSON.parse(this.responseText), true]);
};

Summery

It’s all About this issue. Hope all solution helped you a lot. Comment below Your thoughts and your queries. Also, Comment below which solution worked for you? Thank You.

Also, Read

Leave a Comment