title: Iterating over multiple arrays in JSON object in React
body: <p>I've been trying to return the first object of the first array in my JSON object, but I'm having some trouble.</p>
  
  <p>I want to return the name of the first "vitamins", which is "Vitamin B2", in an  tag.</p>
  
  <p>Here is my JSON object</p>
  
  <pre><code>{
    "nutrients": {
      "vitamins": [{
        "name": "Vitamin B2",
        "current": "1.7"
      },
      {
        "name": "Vitamin B6",
          "current": "10.9"
      }],
        "minerals": [{
          "name": "Zinc",
          "current": "1.7"
      }]
    }
  }
  </code></pre>
  
  <p>And here is my code trying to map over it</p>
  
  <pre><code>import nutrients from '../../vitamins.json';
  
  renderData() {
    return Object.keys(nutrients).map((nutrient, index) =&gt; {
      console.log('it works', nutrient[0].name, index);
      return (
        &lt;option value="" key={index}&gt;{nutrient[0].name}&lt;/option&gt;
      )
    }
  )}
  </code></pre>