Babban matsalar da ke da alaƙa da React Router 404 redirect shine cewa yana iya yin wahala aiwatarwa. Tunda React Router bashi da ginanniyar shafi 404, dole ne masu haɓakawa su ƙirƙiri hanya da hannu don shafin 404 sannan su saita na'ura mai ba da hanya tsakanin hanyoyin sadarwa don tura duk wani buƙatun da bai dace da hanyar da ake da su ba. Wannan yana buƙatar ƙarin lamba da daidaitawa, wanda zai iya ɗaukar lokaci kuma yana da wahalar cirewa idan wani abu ya ɓace. Bugu da ƙari, idan mai amfani ya kewaya kai tsaye zuwa URL ɗin da babu shi, har yanzu za su ga shafin kuskure maimakon a tura su zuwa shafin 404.
import { BrowserRouter as Router, Route, Switch } from "react-router-dom";
const App = () => (
<Router>
<Switch>
<Route exact path="/" component={Home} />
<Route exact path="/about" component={About} />
{/* 404 Redirect */}
<Route render={() => (<Redirect to="/" />)} />
</Switch>
</Router>
);
Layin 1: Wannan layin yana shigo da BrowserRouter, Route, da Canja abubuwan da aka gyara daga ɗakin karatu na react-router-dom.
// Layin 3: Wannan layin yana bayyana aikin da ake kira App da ke dawo da JSX.
Layi na 5-7: Waɗannan layin sun haɗa ɓangaren App a cikin ɓangaren na'ura mai ba da hanya tsakanin hanyoyin sadarwa daga amsa-router-dom.
Layi na 8-10: Waɗannan layukan sun bayyana hanyoyi guda biyu don Gida da Game da abubuwan da aka gyara bi da bi.
// Layin 12: Wannan layin yana bayyana hanyar da ke karkata zuwa shafin Gida idan babu wata hanyar da ta dace.
Menene Lambar Kuskuren 404
Lambar kuskure 404 a cikin React Router lambar matsayi ce ta HTTP wacce ke nuna cewa ba a iya samun albarkatun da ake nema ba. Yawancin lokaci ana mayar da ita lokacin da mai amfani yayi ƙoƙarin samun dama ga shafi ko hanyar da babu ita. Wannan na iya faruwa idan mai amfani ya yi kuskuren rubuta URL, ko kuma idan an cire ko matsar da shafin ba tare da sabunta hanyoyin haɗin yanar gizon ba. Lokacin da wannan ya faru, React Router zai nuna babban shafi na 404 tare da saƙon da ya dace yana sanar da mai amfani kuskuren su.
404 Komawa
A cikin React Router, tura 404 hanya ce ta tura masu amfani zuwa wani shafi na daban lokacin da suke ƙoƙarin samun damar URL mara inganci. Wannan na iya zama da amfani don samar wa masu amfani da ingantacciyar ƙwarewa lokacin da suka shigar da URL ɗin da ba daidai ba ko ƙoƙarin shiga shafin da babu shi. Ana iya aiwatar da turawa ta 404 ta amfani da bangaren Redirect daga React Router, wanda ke ba ka damar saka sunan hanyar shafin da kake son tura mai amfani zuwa gare shi. Misali, idan wani yayi kokarin shiga /invalid-url, zaku iya amfani da bangaren Redirect kamar haka:
