U React aplikaciji, formatiranje URL-a i routing igraju ključnu ulogu u kretanju stranicama i prikazivanju odgovarajućeg sadržaja. Za upravljanje routing u Reactu možemo koristiti knjižnicu. Ovdje je osnovni vodič o tome kako koristiti za formatiranje URL-ova i rukovanje u vašoj React aplikaciji. React Router React Router routing
Instalirati React Router
Otvorite svoj direktorij projekta u terminalu i pokrenite sljedeću naredbu za instalaciju: React Router npm install react-router-dom
Uvezite potrebne komponente iz u svoju React komponentu. React Router
Definirajte rute
Upotrijebite komponentu da omotate svoju React aplikaciju i postavite osnovni format URL-a. <BrowserRouter>
Koristite <Route>
komponentu za definiranje ruta u svojoj aplikaciji.
Primjer:
Definirajte Link s
Koristite komponentu za stvaranje navigacije u vašoj aplikaciji. <Link>
link
Primjer:
Parametri pristupnog puta
Koristite <Route>
komponentu s path
atributom u formatu /users/:id
za pristup parametrima staze.
Unutar komponente definirane pomoću <Route>
, možete koristiti useParams()
za pristup vrijednostima parametara staze.
Primjer:
Koristite Switch i Redirect
Koristite komponentu za prikaz samo prve rute koja odgovara stazi. <Switch>
Koristite komponentu za korisnike s jednog navedenog puta na drugi. <Redirect>
redirect
Primjer:
Ovo su neki osnovni koncepti oblikovanja URL-a i routing korištenja Reacta. Korištenjem možete izraditi fleksibilne React aplikacije s mogućnošću navigacije i prikaza različitih sadržaja na temelju URL-a. React Router React Router