TypeError: items.map is not a function

1

I made a request in a URL via Fetch, however it returns an error when I request json mapping, does anyone know how to solve it?

I've hidden the URL because it's private.

import React, { Component } from 'react';


class App extends Component {
 constructor(props){
 super(props);
 this.state = {
 items:[],
 isLoaded: false,
 }
 }

componentDidMount(){
fetch('***')
  .then(res => res.json())
  .then(json => { 
    this.setState({
      isLoaded: true,
      items : json,
    })
  });
 }

render() {

var{isLoaded, items} = this.state;

if(!isLoaded){
  return <div>Loading..</div>
}
else{

return (
    <div className="App">
      <ul>
        {items.map(item => (
          <li key = {item.id}>
            Name : {item.name} | {item.name}
          </li>
        ))};
      </ul>    
    </div>
  );
 }
}

}

export default App;

    
asked by anonymous 31.08.2018 / 13:23

1 answer

0

The first thing you should do is give console.log(res.json()) to know what is coming in this request. The .map will only be executed if it is an array, if something is coming in this res.json () use the typeof command to check the type. Certainly what is happening to this response is not an array, or nothing is happening.

    
31.08.2018 / 15:16