如何使用 item.description 在列表視圖中選擇一個項目

Question

這是應用程序，我想創建具有不同類別的不同屏幕，在這種情況下，我有皮膚科和醫院，我如何只選擇一個描述

 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,
       }
     ]
   });

   return(

我只想選擇帶有描述 == dermatologista 的項目我該怎么做？

   <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>

  
  
   

) }

Answer 1

您可以使用array.filter ：

const filteredPlaces = state.places.filter( place => place.description === "Dermatologista" )

並將filteredPlaces而不是整個對象傳遞給子組件。

Answer 2

嘗試這個

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

     }
 

}
/>

</SafeAreaView>