Not getting Images in Flat list in React Native using Flask

Question

React Native code:

import React, { useEffect, useRef, useState } from 'react'
import { View, Text, StyleSheet, TouchableOpacity, TextInput, Image, Button, SafeAreaView, FlatList } from 'react-native'

export default function ResultsBiceps({navigation}) {

  useEffect(()=>{
    GetImages()
  },[])

  const[data,setData]=useState([])

  const GetImages = async () => {
    try {
      const response = await fetch(
        'http://ip address:5000/getImages'
      );
      const json = await response.json();
      setData(json)
     console.log(json);
    } catch (error) {
      console.error(error);
    } 
  }

  return (
    <View>
      <FlatList
       data={data}
       renderItem={({item})=>{
         return(
           <View style={{padding:10, backgroundColor:'white', margin:'5%'}}>
             <Image 
              source={{uri: item}}
              style={{width :300, height:300}}
             />
           </View>
         );
       }}
      />
    </View>
  )
}

This is where I am getting list of images from API and to display it in flat list but I am not getting images from this code.

API code

@app.route("/getImages", methods=['GET'])
def getImages():
    listOfFile = os.listdir('./wrongFrames/')
    listOFFiles = []
    # Iterate over all the entries
    for entry in listOfFile:
        print(entry)
        # //send_from_directory("wrongFrames", entry, as_attachment=True)
        # Create full path
        if not os.path.isdir(entry):
            listOFFiles.append(entry)
    print(listOFFiles)
    return jsonify(listOFFiles)

Here I am storing images in list and send it to front-end but I am not getting any images from this code. I am trying to solve this for quite some time but have not manage to solve it I just cannot find where I am doing wrong here.