El principal problema relacionat amb React Router Link รฉs que no actualitza correctament l'historial del navegador quan es fa clic. Aixรฒ vol dir que si un usuari fa clic a un enllaรง i desprรฉs prem el botรณ enrere, es portarร de nou a la pร gina anterior en lloc de la pร gina de la qual acaba de navegar. A mรฉs, aixรฒ pot provocar un comportament inesperat en alguns casos, com ara quan s'utilitzen cadenes de consulta o fragments hash.
import { BrowserRouter as Router, Route, Link } from "react-router-dom"; <Router> <div> <Link to="/">Home</Link> <Link to="/about">About</Link> <Route exact path="/" component={Home} /> <Route path="/about" component={About} /> </div> </Router>
1. importa { BrowserRouter com a router, ruta, enllaรง } de "react-router-dom";
// Aquesta lรญnia importa els components BrowserRouter, Route i Link de la biblioteca react-router-dom.
2.
// Aquesta lรญnia crea un component d'encaminador que s'utilitzarร per crear rutes per a la nostra aplicaciรณ.
3.
4. Inici
// Aquesta lรญnia crea un enllaรง a la pร gina d'inici de la nostra aplicaciรณ amb el text 'Inici'.
5. Qui som?
// Aquesta lรญnia crea un enllaรง a la pร gina "sobre" de la nostra aplicaciรณ amb el text "Sobre".
6.
// Aquesta lรญnia crea una ruta per a la pร gina d'inici de la nostra aplicaciรณ i representa el component Inici quan hi accedeix un usuari.
7.
8.
//Aixรฒ tanca el nostre element div que contรฉ totes les nostres rutes i enllaรงos
Enllaรง v6
Link v6 รฉs un nou component de React Router que proporciona una soluciรณ de navegaciรณ accessible i declarativa per a les aplicacions de React. Substitueix el component d'enllaรง anterior i ofereix mรฉs funcions i un millor suport per a l'accessibilitat. Link v6 admet tant enllaรงos regulars com encaminament dinร mic, cosa que permet als desenvolupadors crear experiรจncies de navegaciรณ potents sense haver de gestionar les rutes manualment ni utilitzar biblioteques de tercers. Tambรฉ admet la representaciรณ del costat del servidor, que permet als desenvolupadors crear aplicacions compatibles amb SEO amb un esforรง mรญnim. Finalment, Link v6 tรฉ suport integrat per al seguiment analรญtic, cosa que facilita el seguiment de les interaccions dels usuaris amb la vostra aplicaciรณ.
Per quรจ React Router Link no funciona
Hi ha diversos motius possibles pels quals React Router Link no funciona a React Router. El motiu mรฉs comรบ รฉs que el component al qual s'enllaรงa no estร configurat o configurat correctament. Per exemple, si el component al qual s'enllaรงa no s'ha importat correctament, o si la ruta de ruta รฉs incorrecta, React Router Link no funcionarร . A mรฉs, si hi ha errors ortogrร fics al camรญ de la ruta o al nom del component, aixรฒ tambรฉ pot causar problemes amb React Router Link. Finalment, si hi ha conflictes entre diverses rutes (com ara dues rutes amb el mateix camรญ exacte), aixรฒ tambรฉ pot causar problemes amb React Router Link.