Dans une application React, le formatage des URL routing joue un rôle crucial dans la navigation des pages et l'affichage du contenu correspondant. Pour gérer routing dans React, nous pouvons utiliser la bibliothèque. Voici un guide de base sur la façon d'utiliser pour formater les URL et les gérer dans votre application React. React Router React Router routing
Installer React Router
Ouvrez votre répertoire de projet dans le terminal et exécutez la commande suivante pour installer: React Router npm install react-router-dom
Importez les composants nécessaires depuis votre composant React. React Router
Définir les itinéraires
Utilisez le composant pour envelopper votre application React et définir un format d'URL de base. <BrowserRouter>
Utilisez le <Route>
composant pour définir des routes dans votre application.
Exemple:
Définir Link s
Utilisez le composant pour créer des navigations dans votre application. <Link>
link
Exemple:
Paramètres de chemin d'accès
Utilisez le <Route>
composant avec un path
attribut au format /users/:id
pour accéder aux paramètres de chemin.
Dans le composant défini par <Route>
, vous pouvez utiliser useParams()
pour accéder aux valeurs des paramètres de chemin.
Exemple:
Utiliser Switch et Redirect
Utilisez le composant pour rendre uniquement le premier itinéraire qui correspond au chemin. <Switch>
Utilisez le composant pour les utilisateurs d'un chemin spécifié à un autre. <Redirect>
redirect
Exemple:
Ce sont quelques concepts de base du formatage d'URL et routing de React en utilisant. En utilisant, vous pouvez créer des applications React flexibles avec la possibilité de naviguer et d'afficher divers contenus en fonction de l'URL. React Router React Router