title: How to use ES6 map function in React stateless component
body: <p>In my React application, I have an array of objects which I get through an api response. I want to display each object detail in an accordion. I am using react-accessible accordion and have created a React Stateless Component. I want each of my accordion to represent one object of the array. I have my array of objects in dataProp and to iterate over that 
  I have written my component like below-</p>
  
  <pre><code>import React from 'react';
  import ReactDOM from 'react-dom';
  import ChildAccordion from './ChildAccordion'
  import { setData } from '../actions/action'
  import { connect } from 'react-redux'
  
  import {
      Accordion,
      AccordionItem,
      AccordionItemTitle,
      AccordionItemBody,
  } from 'react-accessible-accordion';
  
  
  import 'react-accessible-accordion/dist/fancy-example.css';
  import 'react-accessible-accordion/dist/minimal-example.css';
  
  
  class ParentAccordion extends React.Component {
  
      componentWillMount() {
        //call to action
        this.props.setData();
    }
  
    getMappedData = (dataProp) =&gt;{
        if (dataProp) { 
           return dataProp.map(item =&gt;{
              return &lt;div&gt;{dataProp[item]}&lt;/div&gt;
          })
        }
        else {
         return "";
        }
  }
  
      render(){
          const { dataProp } = this.props;
          return (
              // RENDER THE COMPONENT
                  &lt;Accordion&gt;
          &lt;AccordionItem&gt;
              &lt;AccordionItemTitle&gt;
                  &lt;h3&gt;Details: 
                 { 
                  this.getMappedData(item[name])
                 }
  
                  &lt;/h3&gt;
              &lt;/AccordionItemTitle&gt;
              &lt;AccordionItemBody&gt;
              &lt;ChildAccordion {...dataProp} /&gt;
              &lt;/AccordionItemBody&gt;
          &lt;/AccordionItem&gt;
      &lt;/Accordion&gt;
          );
      }
  }
  
  
  const mapStateToProps = state =&gt; {
      return {
          dataProp: state.dataProp
      }
  };
  
  const mapDispatchToProps = dispatch =&gt; ({
    setData(data) {
      dispatch(setData(data));
    }
  })
  export default connect (mapStateToProps,mapDispatchToProps) (ParentAccordion)
  </code></pre>
  
  <p>While doing so, this gives me error-</p>
  
  <pre><code>Uncaught ReferenceError: item is not defined
  </code></pre>
  
  <p>Can someone let me know where I am going wrong? Thanks in advance.</p>