title: Flatlist Image source in React Native
body: <p>I am trying to render a <code>FlatList</code> in React Native that it will be like an image carousel.</p>
  
  <p>I want to provide the image sources in the assets folder and pass each items source in the renderItem but i get error undefined is not an object.</p>
  
  <p>Here is the state:</p>
  
  <pre><code>export default function App() {
    const [images, setimages] = useState([
      {src:require('./assets/image1.png'),key:'1'},
      {src:require('./assets/image2.png'),key:'2'},
      {src:require('./assets/image3.png'),key:'3'},
      {src:require('./assets/image4.png'),key:'4'},
      {src:require('./assets/image5.png'),key:'5'}
    ]);
  </code></pre>
  
  <p>And here is the <code>FlatList</code>:</p>
  
  <pre><code>&lt;FlatList
    horizontal={true} 
    showsHorizontalScrollIndicator={false} 
    data={images}
    renderItem={ ({images}) =&gt; (
      &lt;Image source={images.src} style={{
        width:260,
        height:300,
        borderWidth:2,
        borderColor:'#d35647',
        resizeMode:'contain',
        margin:8
      }}&gt;&lt;/Image&gt;
    )}
  /&gt;
  </code></pre>