import React, { Component } from 'react';
import Image from './Image';
var axios = require('axios');

export default class ImageList extends Component {

  getImage = () => {
    axios.get("https://crossorigin.me/http://xkcd.com/1/info.0.json").then(function(reponse){
        this.setState({
          object: reponse.data
        });
        console.log(reponse.data);
    });
  }

  componentDidMount(){
    getImage()
  }

  render() {
    return (
      <div className="gallery">
        <div className="images">
          <Image key={this.state.object.num} id={this.state.object.num} path={this.state.object.url} />
          /*{this.props.imageUrls.map((object) => <Image key={object.id} id={object.id} path={object.url}/>)}*/
        </div>
      </div>
    );
  }
}