Riješeno: reagirati usmjerivač pređe

Glavni problem povezan s React Router pređom je to što može biti teško ispravno konfigurirati. Zahtijeva puno postavljanja i konfiguracije, a ako se ne izvrši ispravno, može dovesti do neočekivanog ponašanja ili pogrešaka. Osim toga, dokumentacija za React Router yarn nije uvijek jasna ili ažurna, što programerima otežava rješavanje problema.

 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. Ovaj redak uvozi komponente BrowserRouter, Route i Link iz biblioteke react-router-dom:
import { BrowserRouter as Router, Route, Link } from “react-router-dom”;

2. Ovaj redak omata cijelu aplikaciju u komponentu usmjerivača kako bi se omogućila funkcionalnost usmjeravanja:

3. Ovaj div element sadrži popis veza koje će se koristiti za navigaciju između različitih ruta:

  • Naslovna
  • O nama
  • Teme

4. Ovaj element hr koristi se kao vizualni separator između navigacijskih veza i sadržaja rute:


5. Ove linije definiraju tri različite rute za našu aplikaciju pomoću komponente Ruta React Routera:

6. Konačno, ova zaključna div oznaka zatvara naš div element omotača aplikacije:

što je React Router

React Router je biblioteka za usmjeravanje za React koja programerima omogućuje stvaranje i upravljanje rutama unutar svojih React aplikacija. Omogućuje način za deklarativno mapiranje ruta do komponenti, rukovanje URL parametrima i upravljanje navigacijskim događajima. Također pruža značajke kao što su dinamičko usklađivanje rute, upravljanje prijelazom lokacije i obnavljanje pomicanjem.

Što je pređa

Yarn je upravitelj paketa za JavaScript koji pomaže programerima da upravljaju svojim ovisnostima na učinkovitiji i sigurniji način. React Router ga koristi za instaliranje, ažuriranje i konfiguriranje paketa. Yarn također pomaže programerima da prate ovisnosti svojih projekata, osiguravajući da su svi potrebni paketi instalirani i ažurni. To olakšava rad na projektima s više programera jer svaki može jednostavno provjeriti koje verzije paketa treba koristiti.

Povezani postovi:

Ostavite komentar