REACT SAMPLE

api.js

  
import axios from 'axios';

export function getData(_url){

    return axios.get(`${_url}?v=${_now}`)
        .catch(error => {
            console.log(error);
        });
};

REACT SAMPLE.js

import React, { Component } from 'react';
import ReactDOM from 'react-dom';
import Banner from './stateless/Banner/Banner';
import ContestWinnerList from './stateless/ContestWinnerList/ContestWinnerList';
import { getData, closeRequest } from './helpers/GetDailyContestWinners';

class DailyContestWinners extends Component {
    state = {
        externalData: [],
        loading: false,
    }
    
    mounted = false;
    
    componentDidMount() {
        console.log("DailyContestWinners Component Mounted...");
        this.setState({ loading: true });
        this.mounted = true;
        // Make API request, passing this as a param to setState with exteranlData loaded...
        getData('https://cdn.lucktastic.com/images/daily-winners/winners.json').then(response => {
            if(this.mounted) this.setState({externalData: response.data, loading: false});
        });
    }

    componentWillUnmount() {
        this.mounted = false;
    }

    render() {
        console.log("Updated state with payload. Ready to pass and render.");
        return(
            <div className={"view-wrapper"}>
                <Banner/>
                { !this.state.loading && this.state.externalData.length > 0 && <ContestWinnerList data={this.state.externalData}/> }
            </div>
        );

    }
}