title: React AntDesign Menu Sub Item ... make it work like component
body: <p>For the AntD menu ... we utilise <code>&lt;Menu&gt;</code>, <code>&lt;Menu.Item&gt;</code>, <code>&lt;SubMenu&gt;</code>.</p>
  <p>But I don't want to use these for navigation but rather for representation. I want to display the attributes of an object using a dropdown as such.</p>
  <p>For eg. Apple -&gt; red, fruit; Cucumber -&gt; green, vegetable; would be displayed as a menu with Apple and Cucumber as the Submenu headings, and the dropdowns for each would be red, fruit and green, vegetable respectively.</p>
  <p>But I don't want to predefine attributes and Submenu headings. If it was a component (cards for example), I could've made the component render per object, so that if there were 10 objects, 10 cards (for example) would be rendered.</p>
  <p>Is it possible to do the same for <code>&lt;SubMenu&gt;</code> and <code>&lt;Menu.Item&gt;</code> where I send the data and it first looks at the key 'Name' and renders as a Submenu Heading and renders attributes individually as Menu Items within the Submenu?</p>
  <p>Are there any alternatives I can make use of?</p>
  <hr />
  <p>Not sure If my question is very clear ... I'm happy to clarify anything if confused.</p>