title: React native How to add Images with map()
body: <pre><code>import React from &quot;react&quot;;
  import { View, Text, StyleSheet, ScrollView, Image } from &quot;react-native&quot;;
  
  const Icons = [
    { name: &quot;Food&quot;, uri: require(&quot;./images/Food.png&quot;) },
    { name: &quot;Mart&quot;, uri: require(&quot;./images/mart.png&quot;) },
    { name: &quot;Car&quot;,  uri: require(&quot;./images/car.png&quot;)  }
  ];
  
  const IconSelection = Icons.map((icons) =&gt; (
    &lt;View&gt;
      &lt;Image source={icons.uri} /&gt;
      &lt;Text style={{ textAlign: &quot;center&quot; }}&gt;{icons.name}&lt;/Text&gt;
    &lt;/View&gt;
  ));
  
  const styles = StyleSheet.create({});
  
  export default IconSelection;
  </code></pre>
  <p>IconSelection.js
  How do I add images inside my const Icons? Basically I want to create like a list of Icons using images and able to call them. Previously my method is basically handcode them but I found it is very messy. I think maps() could help me but I'm not really sure how to use it too. Thank you.</p>