J'essaie d'afficher un badge avec le nombre de propriétés de chaque type de propriété. Les données de l'API sont reçues, mais le composant Badge ne rend pas.
renderItem = ({item}) => {
return(
<View>
....
```{this.countProp(item.id)}
</View>
)
}
3 Réponses :
Vous pouvez enregistrer à intervention.properties.length dans l'état, puis l'accédez à renderItem .
Quelque chose comme ceci: renderitem , vous pouvez faire quelque chose comme ceci:
Merci pour votre réponse! Le badge rend maintenant rendu mais la valeur est null, l'état ne semble pas mettre à jour.
Comment avez-vous dirigé ce premier morceau de code? Je le mettrais dans une méthode et l'exécuterais à l'intérieur ComposantDidMount . S'il renvoie une valeur, l'état sera défini et il sera visible dans le badge. Je ne sais pas quelle était votre approche.
Oui, je l'ai mis à l'intérieur de la méthode "CountProp (TYPEID)", mais le résultat que je voulais demander que cette méthode soit appelée à l'intérieur de la méthode "RenderItem (TypeObject)" afin d'obtenir le nombre de propriétés pour chaque type. () Inside ComponentDidMount ne fonctionnerait pas pour moi. J'espère avoir expliqué mon approche clairement et encore merci pour votre aide.
countProp = (id) => {
fetch('http://10.0.2.2:8000/api/property/' + id).then((data) => data.json()).then((response) => {
this.setState({ length: response.properties.length });
});
};
renderItem = ({ item }) => {
this.countProp(item.id);
return (
<View>
<Badge value={this.state.length} />
</View>
);
}
Hope that helps.
J'ai aussi essayé cette approche, mais cela ne le répare pas, merci de toute façon.
Vous trouverez peut-être plus facile de la casser dans un composant séparé et de faire appel à l'API dans le composantDidMount quelque chose comme: , puis utilisez ce composant qui le passe comme ID: p > import Item from "./path/to/Item.js";
...
<Item id={ 7 } />