Chargement paresseux des données de Firestore en temps réel à l’aide de Flutter | par Jacobo Soffer | Meilleure programmation | Sept. 2020

Online Coding Courses for Kids

Créez un nouveau répertoire appelé data_bloc. Là, créez les fichiers suivants:

  • data_bloc.dart
  • data_events.dart
  • data_state.dart

Commençons par créer les événements pour notre Bloc. Dans le fichier data_events.dart, ajoutez les lignes suivantes:

Ici, nous créons une classe de base étendant Equatable afin que nous puissions comparer nos événements. Maintenant que nous avons la classe sur laquelle baser nos événements, définissons les événements que notre Bloc devrait avoir:

  • DataEventStart: Utilisé pour configurer notre Bloc
  • DataEventLoad: Utilisé pour informer le Bloc de nouvelles données sont disponibles
  • DataEventFetchMore: Utilisé pour obtenir plus de données une fois que nous sommes épuisés

Ajoutez les lignes suivantes à data_events.dart:

Définissons maintenant les états que notre Bloc émettra:

  • DataStateLoading: Utilisé lorsque les données ne sont pas encore chargées
  • DataStateEmpty: Utilisé lorsqu’il n’y a pas de documents dans la collection que nous avons extraite
  • DataStateLoadSuccess: Utilisé lorsque les données ont été extraites avec succès et contient une liste de publications

Il peut être judicieux d’ajouter un DataLoadFailure état à émettre en cas de problème. Essayez de le mettre en œuvre vous-même.

Ajoutez le code suivant à data_state.dart:

Ici, nous avons implémenté la classe de base et les états que nous avons définis précédemment.

Il est maintenant temps de rassembler notre Bloc. Ajoutez ce qui suit à data_bloc.dart:

La plupart de ce code est très simple. Quand le Bloc reçoit DataEventStart, il réinitialise les variables de classe et annule les abonnements aux flux. Il crée ensuite le premier abonnement en le demandant à notre PostRepository et laisser handleStreamEvent (nous allons mettre en œuvre cette méthode ensuite) prendre en charge les événements reçus du flux.

Lorsque notre Bloc reçoit un DataEventLoad événement, il aplatit d’abord la liste des messages, puis vérifie si elle est vide et renvoie soit DataStateLoadSuccess ou DataStateEmpty.

Notre dernier événement, DataEventFetchMore, demande une nouvelle page de données à notre PostRepository et ajoute l’abonnement au flux à notre liste d’abonnements.

Maintenant que nous avons terminé la majeure partie de notre Bloc, mettons en œuvre le handleStreamEvent méthode. Copiez ce qui suit dans votre bloc:

le handleStreamEvent méthode est plus simple qu’il n’y paraît. Il prend deux arguments, quel que soit le flux qui l’a appelé (passé comme son index dans le posts list) et l’événement reçu du flux en tant que QuerySnapshot.

Lorsqu’elle est appelée, la méthode vérifie d’abord la longueur du QuerySnapshot reçu. Nous demandons 15 documents à la fois, donc si nous en recevons moins, cela signifie que nous avons atteint la fin de la collection.

Il vérifie ensuite s’il gère les événements du dernier abonnement de la liste, et si tel est le cas, il définit le lastDoc variable au dernier document de la capture instantanée de la requête.

Enfin, il met à jour le posts liste et ajoute DataEventLoad à notre Bloc.

Close Menu