.map() , Undefined is not a function in React Native

Question

So I make a call to a API and use it to setState.

My state:

  state = {
   candlesticks: []
};

My API call and promise function:

componentDidMount() {
    axios
      .get(
    "apiurl"
      )
      .then(data => {
        let mappedData = data.map((record) => {record.date *= 1000}); //getting the error here with the map()function
        this.setState({
          candlesticks: mappedData
        });
      });
  }

I've tried different variations on the code but it still gives this error. I'm using Expo framework.

undefined is not a function (evaluating 'data.map(function (record){record.date *= 1000})')

Probably you have to parse the data from the response. That could be something like data.body.map or data.content.map. Print data to see what it really contains! — Sulthan
– Sulthan, Commented May 25, 2017 at 12:59
I have used this same data on the web before so I know. However I used jQuery then. — furball514
– furball514, Commented May 26, 2017 at 9:05

atlanteh · Accepted Answer · 2017-05-26 09:36:53Z

2

Axios returns a response object. Inside the response you have a data property with your data.
So what you need to do is:

componentDidMount() {
    axios.get("apiurl")
    .then(response => {
        let mappedData = response.data.map((record) => {record.date *= 1000}); //getting the error here with the map()function
        this.setState({
            candlesticks: mappedData
        });
    });
}

Edit

Doesn't seem possible that there's a problem with axios, but just to rule it out, try to use the built-in fetch module and see if the data is still null.

componentDidMount() {
    fetch("apiurl")
    .then(response => {
        return response.json();
     })
    .then(data => {
        let mappedData = data.map((record) => {record.date *= 1000});
        this.setState({
            candlesticks: mappedData
        });
    });
}

If it's null then the problem is in your server.

edited May 26, 2017 at 9:36

answered May 25, 2017 at 13:26

atlanteh

5,8254 gold badges36 silver badges57 bronze badges

Sign up to request clarification or add additional context in comments.

9 Comments

furball514 Over a year ago

I was aware of the response object this was a silly error. thank you.

furball514 Over a year ago

The data returned from the response object is all null though.

furball514 Over a year ago

How do I fix this?

furball514 Over a year ago

This same map method and data worked when I was using with jQuery on the web before.

furball514 Over a year ago

The data is returned correctly when the map() method isn't applied.

|

Collectives™ on Stack Overflow

.map() , Undefined is not a function in React Native

1 Answer 1

9 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

9 Comments

Your Answer

Sign up or log in

Post as a guest

Related