Galvenā problēma, kas saistīta ar React Router dziju, ir tā, ka to var būt grūti pareizi konfigurēt. Tas prasa daudz iestatīšanas un konfigurēšanas, un, ja tas tiek darīts nepareizi, tas var izraisīt neparedzētu darbību vai kļūdas. Turklāt React Router dzijas dokumentācija ne vienmēr ir skaidra vai atjaunināta, tāpēc izstrādātājiem ir grūti novērst problēmas.
add react-router-dom
import { BrowserRouter as Router, Route, Link } from "react-router-dom";
<Router>
<div>
<ul>
<li><Link to="/">Home</Link></li>
<li><Link to="/about">About</Link></li>
<li><Link to="/topics">Topics</Link></li>
</ul>
<hr />
<Route exact path="/" component={Home} />
<Route path="/about" component={About} />
<Route path="/topics" component={Topics} />
</div>
</Router>
1. Šajā rindā tiek importēti komponenti BrowserRouter, Route un Link no react-router-dom bibliotēkas:
importēt { BrowserRouter as Router, Route, Link } no “react-router-dom”;
2. Šajā rindā visa lietojumprogramma ir iekļauta maršrutētāja komponentā, lai nodrošinātu maršrutēšanas funkcionalitāti:
3. Šajā div elementā ir saraksts ar saitēm, kuras tiks izmantotas, lai pārvietotos starp dažādiem maršrutiem:
- Sākums
- Par Mums
- tēmas
4. Šis hr elements tiek izmantots kā vizuāls atdalītājs starp navigācijas saitēm un maršruta saturu:
5. Šīs rindas nosaka trīs dažādus maršrutus mūsu lietojumprogrammai, izmantojot React Router Route komponentu:
6. Visbeidzot, šis aizverošais div tags aizver mūsu lietojumprogrammas iesaiņojuma div elementu:
kas ir React Router
React Router ir React maršrutēšanas bibliotēka, kas ļauj izstrādātājiem izveidot un pārvaldīt maršrutus savās React lietojumprogrammās. Tas nodrošina veidu, kā deklaratīvi kartēt maršrutus ar komponentiem, apstrādāt URL parametrus un pārvaldīt navigācijas notikumus. Tas nodrošina arī tādas funkcijas kā dinamiska maršruta saskaņošana, atrašanās vietas pārejas apstrāde un ritināšanas atjaunošana.
Kas ir Dzija
Yarn ir JavaScript pakotņu pārvaldnieks, kas palīdz izstrādātājiem efektīvāk un drošāk pārvaldīt savas atkarības. To izmanto React Router, lai instalētu, atjauninātu un konfigurētu pakotnes. Dzija arī palīdz izstrādātājiem sekot līdzi sava projekta atkarībām, nodrošinot, ka visas nepieciešamās pakotnes ir instalētas un atjauninātas. Tas atvieglo darbu pie projektiem ar vairākiem izstrādātājiem, jo katrs no tiem var viegli pārbaudīt, kuras pakotņu versijas viņiem ir jāizmanto.