J'essaie d'afficher une liste d'éléments avec des variations basées sur un de ses objets. Voir le code ci-dessous pour un aperçu:Mappage d'un tableau imbriqué d'objets dans React Native
data: [{
"transportation": [
{"id": "1", "name": "bus", "type": "large"},
{"id": "2", "name": "bicycle", "type": "small"}],
"animal": [
{"id": "3", "name": "elephant", "type": "large"},
{"id": "4", "name": "mouse", "type": "small"}]
}]Pour l'exemple ci-dessus, je voudrais afficher laisse dire quelque chose de simple comme du texte « Large » si le type est « grand » et « Petit "text" si le type est "small" La première chose qui me vient à l'esprit est de faire une carte imbriquée (carte externe pour les données, carte interne pour le transport/animal) J'ai commencé par tester la carte intérieure sans la carte externe comme illustré ci-dessous:
data.animal.map((info) => {
switch (info.type){
case "large":
return(
<View>
<Text>Large</Text>
</View>);
case "small":
return(
<View>
<Text>Small</Text>
</View>);
default:
return(
<View>
<Text>Whatever</Text>
</View>);
}
})J'obtenu
TypeError: Cannot read property 'map' of undefined
Toute idée pourquoi cela se produit?
EDIT:
j'avais essayé de faire une boucle imbriquée en attendant une réponse. Ci-dessous mon extrait de code:
data.map((category, key) => {
return(
Object.keys(category).map((info) => {
switch (info.type){
case "large":
return(
<View>
<Text>Large</Text>
</View>);
case "small":
return(
<View>
<Text>Small</Text>
</View>);
default:
return(
<View>
<Text>Whatever</Text>
</View>);
}
})
)
})Il fonctionne sans erreur, mais il ne me donne pas le résultat escompté. Toutes les sorties sont commutées par défaut, c'est-à-dire "Peu importe".