title: Mapping object keys in react and returning child properties
body: <p>I have a report that maps the number of objects. In my example there is 3 object arrays. I want to get a value of one of the properties in each object when it maps. </p>
  
  <p>Here is my snippet React code that returns the reports:</p>
  
  <pre><code>return (
      &lt;React.Fragment&gt;
          { Object.keys(result).map((item, i) =&gt; (
              &lt;div key={i} className="report"&gt;
                      &lt;h3&gt;{result[item].name}&lt;/h3&gt;
              &lt;/div&gt;
      ))}
      &lt;/React.Fragment&gt;
  )
  </code></pre>
  
  <p>It maps <code>const result</code> that outputs like:</p>
  
  <pre><code>result = {GK: Array(1), FB: Array(2), FW: Array(1)}
  </code></pre>
  
  <p>There are 3 reports above - GK, FB and FW</p>
  
  <p>I now want to go into each report and get a value. Lets look at FB:</p>
  
  <pre><code>FB: [ 0:{Number: 1, newNumber:"1", name: "FB" }
        1:{Number: 1, newNumber:"1", name: "FB" }
      ]
  </code></pre>
  
  <p>I want to make sure that when I retrieve the report the <code>name</code> property also maps and any other property I want to grab.</p>
  
  <pre><code>&lt;h3&gt;{result[item].name}&lt;/h3&gt;
  </code></pre>
  
  <p>I thought the above would retrieve name. So the result I get is 3 blank reports.</p>