TypeError: undefined is not a object (evaluating ‘item.id’)

here I create the data that I called “places” that part is ok, but remember that is not my main page from the app, its a function{navigation}

export default function Search({ navigation }) {
const [state, setState] = useState({
      places: [
      {
        id: 1,
        title: 'Clinica da pele',
        description: 'Dermatologista',
        latitude:-2.42206406,
        longitude:-54.71947789,
      },
      {
        id: 2 ,
        title:'Unimed',
        description:'Hospital',
        latitude:-2.42501721,
        longitude:-54.71146077,
       },
      {
       id: 3,
       title: 'Dra. Josimar',
       description:'Dermatologista',
       latitude: -2.4288346,
       longitude:-54.7290553,
      }
    ]
  })

here I tried to reder but dor some reason it didn’t work, the error is in item.id but I dont know how to solve

     return(

       <SafeAreaView>
         <FlatList
           styles = {styles.PlaceContainer}
           showsVerticalScrollIndicator
           data={state.places.map}
           keyExtractor={item => item.id}
           renderItem={({ item }) => {
           return(
       <View key={item.id} style={styles.place} >
         <Text>{item.title}</Text>
         <Text>{item.description}</Text>
       </View>
     )
   }
 

}
/>

   </SafeAreaView>

Answer

You are binding FlatList to state.places.map, instead it should be state.places:

<SafeAreaView>
  <FlatList
    styles = {styles.PlaceContainer}
    showsVerticalScrollIndicator
    data={state.places}
    keyExtractor={item => item.id}
    renderItem={({ item }) => {
    return(
       <View key={item.id} style={styles.place} >
         <Text>{item.title}</Text>
         <Text>{item.description}</Text>
       </View>
     )
   }} />
</SafeAreaView>