fetching in react

gistfile1.txt

import React, { Component } from "react";

class Movie extends Component {
  constructor() {
    super();
    this.state = {
      pictures:[],
      error :null,
      loading:false
    };
  }

  componentDidMount() {
      this.setState({loading:true})
    fetch("http://www.omdbapi.com/?i=tt3896198&apikey=3fe2ee61")
      .then(results => results.json())
      .then(res=>{
      console.log(res.data)
          this.setState({pictures: res.data, loading: false})})
      .catch(err=>{
        console.log(err.data)
          this.setState({error:err.data,loading:false});
      });
  }

  render() {
      const {pictures, error,loading} =this.state
    return (
        <div>   
               { loading && <p>Loading...</p>}
                {!loading && <div className="container2">
                    <div className="container1">                       
                        {
                         pictures ?  pictures.map((pic,index )=>{
                            return(
                                <div key={index}>
                                    <img alt="unable to load" src={pic.Poster} />
                                </div>
                            )

                            }) :<div>{error}</div> 
                        }
                    </div>
                </div>}
          
      </div>

    );
  }
}



export default Movie;