title: How to Iterate nested json using Array.map from .json file in reactjs?
body: <p>I have categories and sub categories menu in .json file and I want to iterate these menu using Array.map method, I am able to iterate through categories menu but getting &quot;Cannot read property 'map' of undefined&quot; error for sub categories menu, what am i doing wrong?</p>
  <p>.json file</p>
  <pre class="lang-json prettyprint-override"><code>[
    {
      &quot;id&quot;: 6,
      &quot;name&quot;: &quot;Mobiles&quot;,
      &quot;image&quot;: &quot;img_url&quot;,
      &quot;subCat&quot;: [
        {
          &quot;id&quot;: &quot;591&quot;,
          &quot;name&quot;: &quot;iPhone&quot;
        },
        {
          &quot;id&quot;: &quot;592&quot;,
          &quot;name&quot;: &quot;Samsung Mobiles&quot;
        },
        {
          &quot;id&quot;: &quot;593&quot;,
          &quot;name&quot;: &quot;Huawei Mobiles&quot;
        },
        {
          &quot;id&quot;: &quot;716&quot;,
          &quot;name&quot;: &quot;Nokia Mobiles&quot;
        },
        {
          &quot;id&quot;: &quot;717&quot;,
          &quot;name&quot;: &quot;Oppo Mobiles&quot;
        },
        {
          &quot;id&quot;: &quot;393&quot;,
          &quot;name&quot;: &quot;View All Brands&quot;
        }
      ]
    },
  ]
  </code></pre>
  <p>Categories Component:</p>
  <pre class="lang-js prettyprint-override"><code>import CategoriesMenu from '../../CategoriesMenu.json';
  
  &lt;ul&gt;
    {CategoriesMenu.map((cat) =&gt; (
              &lt;li key={cat.id}&gt;
                {cat.name}
                &lt;div&gt;
                  {CategoriesMenu.subCat.map((subcat) =&gt; (
                    &lt;div key={uuidv4()}&gt;
                      &lt;Link to={`/${subcat.name.toLowerCase().replace(/\s+/g, '-')}/${subcat.id}`}&gt;
                        {subcat.name}
                      &lt;/Link&gt;
                    &lt;/div&gt;
                  ))}
                &lt;/div&gt;
              &lt;/li&gt;
            ))}
          &lt;/ul&gt;
  </code></pre>