Why am I not able render data to screen...Can see in terminal all the data but it wont render with flatslit

Viewed 25

enter image description here

this is the set up... using use effect to pull all users from data to display in flat list... console.logging data from all friends and it appears in the terminal... but it will not render in flatList or says undefined when I console.log res.data.fullName etc...

import { View, Text, FlatList } from 'react-native'
import React, { useEffect, useState } from 'react'
import axios from 'axios';


const FriendsList = () => {

    const [allFriends, setAllFriends] = useState([]);

    console.log(allFriends)
    useEffect(() => {
        axios.get('http://localhost:3000/api/users')
            .then(res => {
                console.log(res)
            })
            .catch(err => console.log(err))
    }, [])

    return (
        <>
            <Text>Friends:</Text>
            <FlatList
                data={allFriends}
                keyExtractor={(friend, id)=> id}
                renderItem={({ item }) => {
                    return ( 
                        <View>   
                        <Text>{item.fullName }</Text>
                        </View>
                    )
                }}
            />
        </>
    )
}

export default FriendsList
0 Answers
Related