J'ai un bouton "Charger plus" que je voudrais disparaître lorsque toutes les informations ont été chargées à l'écran. Je sais que c'est quelque chose qui a été demandé sur la pile à quelques reprises et j'ai essayé de mettre en œuvre les solutions données dans ces questions. Cependant, avec ma configuration, le code ne fonctionne pas.
Je ne sais pas comment manipuler l'état pour que le bouton disparaisse lorsque toutes les données sont chargées ou si l'état est ce qui doit être changé.
3 Réponses :
<button
style={{ display: this.state.limitTo >= data.length ? 'none' : 'block' }}
className='loadMore'
onClick={this.onLoadMore}>
Load More
</button>
Simply check if the data you are rendering has a length greater than or equal to the total limit. If it is set the buttons display to none.
J'essayais de faire cela, mais aucune valeur que j'utilise à la place du mot "Data" que vous mettez dans "Data.Length" Travail.
Vous devez fournir plus de code je viens de mettre des données à titre d'exemple. Pour votre cas, je ne peux pas dire exactement ce que vous rendu.
Ok, je pensais que je devrais ajouter tout le dossier. J'ai mis à jour mon message d'origine pour avoir le fichier entier inclus.
Utilisez les boursiers qui sont vos données
D'accord merci. Je l'ai fait auparavant et j'ai eu des erreurs, mais quelque chose d'autre devait être dans la voie, car maintenant, cela fonctionne. Bien que, il ne semble pas fonctionner dans Firefox ou Safari.
J'essaie de deviner ce que vous voulez. Mais c'est le modèle habituel pour cacher quelque chose basé sur une condition donnée. C'est ainsi que vous cacheriez le bouton lorsque la que total de News est quelque chose que vous devriez être dynamiquement, à l'intérieur du composant ou transmis comme un accessoire
J'ai juste essayé une approche aujourd'hui et j'y ai réussi. Fondamentalement, nous allons simplement vérifier si la limite est inférieure à celle de votre total des éléments et uniquement si la condition est une véritable "charge plus" "apparaîtra ou autrement après le chargement complet des données, il va disparaître. (comme une magie)
<button type="button" onClick={this.loadMore}">
Load More Result
</button>
}
Comment votre code sait-il que toutes les données ont été chargées?