Les gestionnaires d’effet dans Jetpack composent: une plongée profonde

Quels sont les effets secondaires de la composition de Jetpack?

Tout en travaillant avec des fonctions composables, elles sont souvent recomposées sur un changement d’état. Lorsque les fonctions proposent, elles peuvent mettre à jour certaines données qui ne sont pas dans le cadre des fonctions composables. De tels scénarios sont appelés effets secondaires. Pour EG, faire un appel réseau dans une fonction de composition qui pourrait être recomposée lorsqu’une fonction de la fonction de composition change.

Dans l’exemple suivant, lorsque nous cliquons sur le bouton Incrément pour incrémenter le compteur, l’API GetCategoryList () est invoquée à chaque fois en raison de la récomposition de la fonction Compose. Par conséquent, conduisant à un effet secondaire.

Échantillon d’effet secondaire

Types de gestionnaires d’effet

Jetpack Compose fournit des solutions à ces effets secondaires en utilisant plusieurs types de gestionnaires d’effet que nous comprendrons brièvement.

Types de gestionnaires

Effet lancé

LaunsedEffect est une fonction composable qui est utilisée pour lancer une coroutine à l’intérieur de la portée de composable. Lorsqu’il est lancé dans la composition, il lance une coroutine et annule lorsqu’il quitte la composition. Ceci est utile pour effectuer des effets secondaires, tels que la réalisation d’appels réseau ou la mise à jour d’une base de données, sans bloquer le thread d’interface utilisateur.

Il faut 2 paramètres:

• Un paramètre Key1 qui décide quand la fonction lambda à l’intérieur
• Fonction Lambda à exécuter.

Dans l’exemple ci-dessous en supposant que getCategoryList () est un appel de réseau, cela devrait être invoqué à l’intérieur de lancement pour éviter d’appeler l’API réseau plusieurs fois même si la récomposition se produit.

Exemple d’effet lancé

Rappelez-vous la portée de la coroutine

Lancé des lancements sur la première composition, afin que nous puissions l’utiliser tel quel. Mais pour avoir un contrôle manuel sur le lancement, utilisez plutôt RememberCoroutinescope. Il donne une portée consacrée au cycle de vie qui peut être utilisée pour lancer une coroutine à l’intérieur. La portée est annulée lorsque l’appel quitte la composition, ce qui rend le cycle de vie.

Dans l’exemple ci-dessous, n’oubliez pas que la portée de Coroutine est utilisée qui sera lancée en un clic sur un bouton et il fournira également une portée de Coroutine pour les exécutions en arrière-plan.

Rappelez-vous

Effet jetable

L’effet jetable est similaire à l’effet de lancement qui est également exécuté sur le paramètre KEY1. Il se compose de la méthode onDisposose () qui peut être utilisée pour toutes les tâches de nettoyage. Pour EG, supprimant certains rappels / auditeurs. Nous utilisons OnDispose pour éliminer les jetables et arrêter l’opération lorsque le composable est supprimé.

Dans l’exemple ci-dessous, nous supprimons l’observateur du propriétaire du cycle de vie à l’aide de la méthode onDispose () de DisposableEffecte.

Échantillon disponible

N’oubliez pas l’état mis à jour

LaunsedEffect Redémarrer lorsque l’une des valeurs des paramètres clés est mise à jour. Mais parfois, nous voulons capturer la valeur modifiée à l’intérieur de l’effet sans le redémarrer. Ce processus est utile si nous avons une option de longue date qui coûte cher à redémarrer. Dans ce cas d’utilisation, nous utilisons le gestionnaire d’effet d’état Met Remember pour avoir l’état mis à jour de la variable même si l’effet lancé est redémarré.

RememberupdatedState Exemple

Sans se souvenir des journaux à étages

En utilisant les journaux de l’État de Remember

Dans l’exemple ci-dessus, nous envoyons la valeur de comptoir mise à jour dans un effet de lancement après un délai de 2 secondes. Dans Counter Text Composable, la valeur de contre-la-valeur (sans état mis à jour) passé par le composable parent est utilisé avant et après un délai de 5 secondes. À l’intérieur de l’effet LanchDeded of Child Composable, la valeur de comptoir mise à jour (10) ne sera pas imprimée car elle a été lancée avec une valeur de comptoir initiale de 0. Si nous modifions la valeur du compteur à utiliser comme état mis à jour L’état du compteur sera également mis à jour après 5 secondes de retard dans l’enfant composable. Par conséquent, cela peut être utilisé si nous avons besoin de l’événement d’état mis à jour une fois les opérations à long terme terminées.

Dérivé

dérivé est un composable qui peut être utilisé pour dériver un nouvel état basé sur les valeurs des autres variables d’état. Il est utile lorsque vous devez calculer une valeur qui dépend d’autres valeurs, et vous souhaitez éviter de recomposer la valeur inutilement.

Dans l’exemple ci-dessous, nous déduisons la couleur d’arrière-plan du contre-texte à l’aide du compteur. Où si le comptoir est divisible par 2, alors la couleur verte d’autre est la couleur rouge.

DervivedStateExample

Produit

produit convertit l’état non compose en état de composition. Le producteur est démarré lorsque l’État produit entre dans la composition et est arrêté lorsqu’il quitte la composition. Il lance une coroutine dans la composition qui peut pousser les valeurs dans un état retourné. Avec l’état des produits, nous avons juste besoin de fournir l’état initial de composition et de lambda de ce qui sera produit en tant qu’état et peut être directement utilisé dans la fonction de composition.

Protestateexample

Conclusion

Grâce à ce guide complet, nous pouvons développer une compréhension de base Effets secondaires de composition et les moyens de les gérer. Cela sera utile lorsque les applications seront implémentées à grande échelle à l’aide de Jetpack Compose.

Vous avez trouvé cela utile? PARTAGEZ-LE