I en React-applikation spiller URL-formatering og routing en afgørende rolle i at navigere på sider og vise tilsvarende indhold. For at administrere routing i React kan vi bruge biblioteket. Her er en grundlæggende guide til, hvordan du bruger til at formatere URL'er og håndtere i din React-applikation. React Router React Router routing
Installere React Router
Åbn din projektmappe i terminalen og kør følgende kommando for at installere: React Router npm install react-router-dom
Importer de nødvendige komponenter fra din React-komponent. React Router
Definer ruter
Brug komponenten til at indpakke din React-applikation og indstille et basis-URL-format. <BrowserRouter>
Brug <Route>
komponenten til at definere ruter i din applikation.
Eksempel:
Definer Link s
Brug komponenten til at oprette navigationer i din applikation. <Link>
link
Eksempel:
Adgangsstiparametre
Brug <Route>
komponenten med en path
attribut i formatet /users/:id
til at få adgang til stiparametre.
Inden for den komponent, der er defineret af <Route>
, kan du bruge useParams()
til at få adgang til værdierne af stiparametre.
Eksempel:
Brug Switch og Redirect
Brug komponenten til kun at gengive den første rute, der matcher stien. <Switch>
Brug komponenten til brugere fra en specificeret sti til en anden. <Redirect>
redirect
Eksempel:
Dette er nogle grundlæggende begreber for URL-formatering og routing i React ved hjælp af. Ved at bruge, kan du oprette fleksible React-applikationer med mulighed for at navigere og vise forskelligt indhold baseret på URL'en. React Router React Router