Navigateur de Pile

Créons une application React Native simple avec deux écrans en utilisant le Stack Navigator de React Navigation.

Tout d'abord, assurez-vous d'avoir installé React Navigation :

Maintenant, créons deux écrans : HomeScreen et DetailsScreen.

Maintenant, configurons la navigation dans notre App.js en utilisant le Stack Navigator :

Nous avons configuré un Stack Navigator de base en utilisant React Navigation.

Décomposons ce que fait chaque partie :

Étape 1

import statements: Importer les modules nécessaires de React et React Navigation, ainsi que les composants d'écran personnalisés (HomeScreen et DetailsScreen).

Étape 2

Créez un navigateur de pile en utilisant createNativeStackNavigator().

Étape 3

Définissez le composant App, qui rend le conteneur de navigation et le navigateur de pile.

Étape 4

Retournez le composant NavigationContainer, qui enveloppe toute la structure de navigation.

Étape 5

Dans le NavigationContainer, définissez le composant Stack.Navigator, qui contient la pile d'écrans.

Étape 6

Ajoutez des écrans à la pile en utilisant les composants Stack.Screen. Chaque écran a un nom unique et est associé à un composant.