Babban matsalar da ke da alaƙa da React Router URL params shine cewa suna iya zama da wahala a yi amfani da su a cikin hanyoyi masu ƙarfi. Wannan saboda URL ɗin suna tsaye kuma ba za a iya canza su ba bayan an ƙirƙiri hanyar. Wannan yana nufin cewa idan mai amfani yana buƙatar samun dama ga wani shafi na daban tare da sigogi daban-daban, za su buƙaci ƙirƙirar sabuwar hanya don kowane haɗin sigina. Bugu da ƙari, lokacin amfani da params na URL, yana iya zama da wahala a kiyaye duk abubuwan haɗin kai da kuma tabbatar da cewa na'ura mai ba da hanya tsakanin hanyoyin sadarwa tana sarrafa kowannensu da kyau.
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.
);
};
Wannan lambar tana saita React Router don yin shafi tare da sunan mai amfani daga URL.
1. Layi na farko yana shigo da abubuwa daga ɗakin karatu na React Router DOM.
2. Aikin App yana mayar da bangaren na'ura mai ba da hanya tsakanin hanyoyin sadarwa tare da bangaren Route a ciki, wanda ke nuna cewa duk URL da ya fara da "/user/" ya kamata ya sanya bangaren UserPage.
3. Aikin UserPage yana amfani da useParams() don samun sunan mai amfani daga URL sannan yayi gaisuwa ta amfani da sunan mai amfani.
URL params
URL params a cikin React Router guda ne na bayanai waɗanda aka wuce zuwa hanya a matsayin ɓangare na URL. Suna ƙyale masu haɓakawa su aika bayanai masu ƙarfi zuwa hanya, kamar ID ko igiyar tambaya. Ana iya amfani da wannan don ƙirƙirar hanyoyi masu ƙarfi waɗanda za a iya amfani da su don abubuwa kamar nuna takamaiman abubuwa daga rumbun adana bayanai ko tace abun ciki dangane da shigar mai amfani. React Router yana ba da kayan aikin shiga da sarrafa abubuwan haɗin URL, yana sauƙaƙa amfani da su a cikin aikace-aikacen ku.
Ta yaya kuke samun alamun URL daga hanya a cikin React
A cikin React Router, zaku iya samun dama ga madaidaitan URL daga hanya ta amfani da ƙugiya ta amfaniParams. Wannan ƙugiya tana dawo da wani abu mai ɗauke da nau'i-nau'i-ƙimar maɓalli na sigogin URL. Misali, idan hanyarka/user/: id, zaka iya samun damar ma'aunin id tare da amfaniParams() id.
