title: Error when getting state value: Uncaught TypeError: Cannot convert undefined or null to object at Function.keys
body: <p>I'm super new to react and sorry for asking such this simple question. </p>
  
  <p>I'm trying to create a chart using ChartJS from an online API.</p>
  
  <p>My js script:</p>
  
  <pre><code> constructor(props) {
      super(props);
      this.state = {
          daily_data: [],
          hourly_data: [],
          currency: this.props.currency,
          chartData: {}
      }
      this.getChartData = this.getChartData.bind(this);
  
  }
  
  getChartData() {
  
      this.setState({
          chartData: {
              datasets: [
                  {
                      label: Object.keys(this.state.daily_data[this.state.currency]),
                      data: Object.values(this.state.daily_data[this.state.currency]),
                      fill: false,
                      borderColor: "rgba(255,255,255,0.1)",
                      backgroundColor: "rgba(0, 0, 0,0.2)",
                      pointBackgroundColor: "rgb(255,255,255)",
                  }
              ]
          }
      })
  
  }
  
   componentWillMount() {
      fetch("https://asia-northeast1-s3688090-cc2018.cloudfunctions.net/cool-api")
      .then(res=&gt;res.json())
      .then(result =&gt; this.setState({
          daily_data: result,
      }))
      .catch(error =&gt; console.log("error" + error));
        }
  
  
  render() {
      this.getChartData();
      return (
     ....
      )
   }
  </code></pre>
  
  <p>The problem occurs at: <code>label: Object.keys(this.state.daily_data[this.state.currency])</code></p>
  
  <pre><code>Uncaught TypeError: Cannot convert undefined or null to object
  at Function.keys (&lt;anonymous&gt;)
  at ViewDetails.getChartData (bundle.js:82729)
  at ViewDetails.render (bundle.js:82783)
  at bundle.js:55899
  at measureLifeCyclePerf (bundle.js:55180)
  at ReactCompositeComponentWrapper._renderValidatedComponentWithoutOwnerOrContext (bundle.js:55898)
  at ReactCompositeComponentWrapper._renderValidatedComponent (bundle.js:55925)
  at ReactCompositeComponentWrapper.performInitialMount (bundle.js:55467)
  at ReactCompositeComponentWrapper.mountComponent (bundle.js:55363)
  at Object.mountComponent (bundle.js:8034)
  </code></pre>
  
  <p>The fetch API is working fine as in my react tool it actually shows that state <code>daily_data</code> has all the API value:</p>
  
  <p><a href="https://i.stack.imgur.com/mKpaq.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/mKpaq.png" alt="enter image description here"></a></p>
  
  <p>As I've read the documents as well as some similar questions on StackOverflow states that ReactJS doesn't mutate the update immediately and can call callback to solve the problem I'm not sure if it's really the problem.</p>
  
  <p>Thanks.</p>