title: Struggling to get some data from api
body: <p>Hi i'm trying to get some data from "currency API" (<a href="https://exchangeratesapi.io/" rel="nofollow noreferrer">https://exchangeratesapi.io/</a>)</p>
  
  <p>and this is code below</p>
  
  <p>App.js</p>
  
  <pre><code>import React, { useEffect, useState, Fragment } from "react";
  import Header from "./Header";
  import Table from "./dashboard/Table";
  import { getLatest } from "../actions/currencyAction";
  import { useDispatch, useSelector } from "react-redux";
  
  function App() {
    const latest = useSelector(state =&gt; state.latest);
    const dispatch = useDispatch();
  
    useEffect(() =&gt; {
      dispatch(getLatest());
    }, []);
  
    return (
      &lt;Fragment&gt;
        &lt;Header /&gt;
        {console.log(latest.rates)}
      &lt;/Fragment&gt;
    );
  }
  export default App;
  </code></pre>
  
  <p>currencyAction.js</p>
  
  <pre><code>import { GET_LATEST } from "../actionType";
  
  import axios from "axios";
  
  export function getLatest() {
    return dispatch =&gt; {
      return axios.get("https://api.exchangeratesapi.io/latest").then(res =&gt; {
        dispatch({ type: GET_LATEST, payload: res.data });
      });
    };
  }
  </code></pre>
  
  <p>I succesfully got the data from api </p>
  
  <pre><code>&lt;Fragment&gt;
        &lt;Header /&gt;
        {console.log(latest.rates)}
      &lt;/Fragment&gt;
  
  {CAD: 1.4372, HKD: 8.4324, ISK: 139.3, PHP: 55.248, DKK: 7.4699, …}
  CAD: 1.4372
  HKD: 8.4324
  ISK: 139.3
  PHP: 55.248
  DKK: 7.4699
  HUF: 337.61
  CZK: 25.186
  AUD: 1.6384
  RON: 4.8063
  SEK: 10.5833
  IDR: 15098.95
  INR: 77.8265
  BRL: 4.7474
  RUB: 70.6675
  HRK: 7.465
  JPY: 120.52
  THB: 34.336
  CHF: 1.06
  SGD: 1.5164
  PLN: 4.2989
  BGN: 1.9558
  TRY: 6.6599
  CNY: 7.6102
  NOK: 10.1328
  NZD: 1.7095
  ZAR: 16.3592
  </code></pre>
  
  <p>but when I'm trying acces each currency, Everthing collapse..</p>
  
  <pre><code>   &lt;Fragment&gt;
        &lt;Header /&gt;
        {console.log(latest.rates.CAD)}
      &lt;/Fragment&gt;
  
  
  TypeError: Cannot read property 'CAD' of undefined
  App
  C:/Users/82102/cb/src/components/App.js:17
    14 | 
    15 |  return (
    16 |    &lt;Fragment&gt;
  &gt; 17 |      &lt;Header /&gt;
       | ^  18 |      {console.log(latest.rates.CAD)}
    19 |    &lt;/Fragment&gt;
    20 |  );
  </code></pre>
  
  <p>I struggled for whole day long but I just can't figure out why it's happening..
  please share your knowledge.. thank you</p>