Théorie

Dans React Native, l'état est un objet JavaScript qui stocke les données dynamiques d'un composant et détermine son comportement. L'état permet à un composant de suivre les informations qui peuvent changer au fil du temps, telles que les entrées utilisateur, les réponses d'API ou tout autre contenu dynamique.

Pourquoi avons-nous besoin de l'état ?

L'état est essentiel lorsque vous souhaitez que votre composant soit dynamique et réponde aux interactions utilisateur. Par exemple, si vous avez un bouton qui bascule un modal ou un compteur qui s'incrémente à chaque pression de bouton, vous avez besoin de l'état pour suivre l'état actuel de ces éléments.

Travailler avec l'État

L'état de React Native est utilisé pour gérer les données dynamiques au sein d'un composant. Il permet aux composants d'avoir des valeurs qui peuvent changer au fil du temps. Les cas d'utilisation courants incluent :

• Saisie Utilisateur : Capturer et mettre à jour la saisie utilisateur (par exemple, champs de formulaire, saisie de texte) ;
• Visibilité des Composants : Basculer la visibilité de certains éléments ;
• Requêtes API : Stocker et mettre à jour les données récupérées des API ;
• UI Dynamique : Gérer les changements dans l'interface utilisateur en fonction des interactions utilisateur.

Exemple 1

Résultat 1

Exemple 2

Considérez un scénario où nous voulons basculer la visibilité d'un composant en fonction de l'appui sur un bouton.

Dans cet exemple, l'état isVisible détermine si le composant <Text> est rendu. L'appui sur le bouton bascule la visibilité.

Résultat 2

En Pratique