Dambudziko guru rine chekuita neReact Router URL params nderekuti dzinogona kunetsa kushandisa munzira dzine simba. Izvi zvinodaro nekuti ma URL params akamira uye haagone kuchinjwa mushure mekunge nzira yagadzirwa. Izvi zvinoreva kuti kana mushandisi achida kuwana rakasiyana peji rine akasiyana paramita, ivo vanozoda kugadzira nzira nyowani kune yega yega parameter musanganiswa. Pamusoro pezvo, kana uchishandisa ma URL params, zvinogona kunetsa kutarisisa zvese zvinogoneka musanganiswa uye kuve nechokwadi chekuti imwe neimwe inobatwa nemazvo nerouter.
import {
BrowserRouter as Router,
Route,
Link,
useParams
} from "react-router-dom";
const App = () => {
return (
<Router>
<div>
<Route path="/user/:username" component={UserPage} />
</div>
</Router>
);
};
const UserPage = () => {
let { username } = useParams(); // Get the username from the URL.
return (
<div>Hello, {username}!</div> // Render a greeting with the username.
);
};
Iyi kodhi iri kumisikidza React Router kuti ipe peji ine zita rekushandisa kubva kuURL.
1. Mutsetse wekutanga unopinza zvinhu kubva kuReact Router DOM raibhurari.
2. Basa reApp rinodzorera chikamu cheRouter nechikamu cheNzira mukati maro, chinotsanangura kuti chero URL inotanga ne "/ mushandisi/" inofanira kupa UserPage chikamu.
3. Basa reMushandisiPage rinoshandisa useParams() kuwana zita rekushandisa kubva paURL robva rakwazisa richishandisa zita iroro.
URL params
URL params muReact Router zvimedu zve data zvinopfuudzwa kunzira sechikamu che URL. Vanobvumira vanogadzira kupfuudza ruzivo rwekuchinja kune nzira, senge ID kana tambo yemibvunzo. Izvi zvinogona kushandiswa kugadzira nzira dzakasimba dzinogona kushandiswa kuzvinhu zvakaita sekuratidza zvinhu kubva mudhatabhesi kana kusefa zvemukati zvinoenderana nekuisa mushandisi. React Router inopa maturusi ekuwana uye kushandura ma URL param, zvichiita kuti zvive nyore kuashandisa mukushandisa kwako.
Iwe unowana sei iyo URL params kubva munzira muReact
MuReact Router, unogona kuwana iyo URL params kubva munzira uchishandisa kushandisaParams hoko. Hoko iyi inodzosa chinhu chine key-value pairs dze URL parameters. Semuenzaniso, kana nzira yako iri /mushandisi/:id, unogona kuwana iyo id parameter ne useParams().id.
