Fetch MultipleAPIs

by Amir Danish

HTML

<div id="app"></div>

CSS

body {
  background: #20262E;
  padding: 20px;
  font-family: Helvetica;
}

#app {
  background: #fff;
  border-radius: 4px;
  padding: 20px;
  transition: all 0.2s;
}

table {
  width: 100%;
  border-collapse: collapse;
}
table {
border-collapse: collapse;
font-family: Arial;
font-size: 11pt;
}

table td {
text-align: left;
padding: 7px;
width: 150px;
}

table tr:nth-child(odd) {background-color: #D9E1F2;}
table tr:nth-child(even) {background-color: #FFFFFF;}

table th {
text-align: center;
padding: 7px;
font-weight: bold;
color: #FFFFFF;
background-color: #4472C4;
}

React

class TodoApp extends React.Component {
     constructor(props) {
        super(props);
        this.state = { World: [], Afghanistan: [], Pakistan: [], Malaysia: [] };
    }


    async componentDidMount() {

        // try {
        //     const { data_af } = await axios.get(`https://corona.lmao.ninja/v2/countries/afghanistan`);
        //     console.log(data);
        //     this.setState({
        //         Afghanistan: data
        //     })
        // } catch (err) {
        //     console.log(err.message)
        // };

        // try {
        //     const { data_world } = await axios.get(`https://corona.lmao.ninja/v2/all`);
        //     const { data_af } = await axios.get(`https://corona.lmao.ninja/v2/countries/afghanistan`);
        //     const { data_ir } = await axios.get(`https://corona.lmao.ninja/v2/countries/iran`);
        //     const { data_pk } = await axios.get(`https://corona.lmao.ninja/v2/countries/pakistan`);
        //     this.setState({
        //         World: data_world,
        //         Afghanistan: data_af,
        //         Iran: data_ir,
        //         Pakistan: data_pk
        //     })
        // } catch (err) {
        //     console.log(err.message)
        // };
        const urls = [
            'https://corona.lmao.ninja/v2/all',
            'https://corona.lmao.ninja/v2/countries/afghanistan',
            'https://corona.lmao.ninja/v2/countries/malaysia',
            'https://corona.lmao.ninja/v2/countries/pakistan'
        ];

        Promise.all(urls.map(url =>
            fetch(url)
                .then(checkStatus)
                .then(parseJSON)
                .catch(error => console.log('There was a problem!', error))
        ))
            .then(data => {
                const data_world = data[0];
                const data_af = data[1];
                const data_my = data[2];
                const data_pk = data[3];
                
                
                this.setState({
                 ...