Megoldva: React router dom IndexRedirect

A React Router DOM IndexRedirect fő problémája az, hogy váratlan átirányításokat okozhat. Ennek az az oka, hogy az IndexRedirect összetevő automatikusan átirányítja a felhasználókat egy megadott útvonalra, amikor hozzáférnek egy webhely gyökér URL-jéhez. Ez megzavarhatja azokat a felhasználókat, akik a kezdőoldalt vagy más tartalmat várják a gyökér URL-en. Ezen túlmenően, ha egy felhasználó már navigált egy adott oldalra, majd frissíti a böngészőjét, akkor egy IndexRedirect összetevő miatt váratlanul átirányíthatják az oldalról.

import { BrowserRouter as Router, Route, IndexRedirect } from "react-router-dom";

<Router>
  <Route path="/">
    <IndexRedirect to="/home" />
    <Route path="/home" component={Home} />
    <Route path="/about" component={About} />
  </Route>  
</Router>

1. „import { BrowserRouter as Router, Route, IndexRedirect } from 'react-router-dom';” – Ez a sor importálja a BrowserRouter, Route és IndexRedirect összetevőket a react-router-dom könyvtárból.

2. "” – Ez a sor az összes útvonalat egy Router komponensbe foglalja, amely egy React alkalmazás útválasztásának beállítására szolgál.

3. "” – Ez a sor egy útvonalat állít be '/' útvonallal. Az erre az útvonalra irányuló kéréseket ez az útvonal kezeli.

4. "” – Ez a sor minden kérést a „/home” '/' elérési útjára irányít át.

5. "” – Ez a sor egy útvonalat állít be a „/home” elérési úttal. Az erre az útvonalra irányuló kéréseket a Home komponens kezeli, amely argumentumként kerül át az Útvonal összetevőbe.

6. "” – Ez a sor egy útvonalat állít be a „/about” útvonallal. Az erre az útvonalra irányuló kéréseket a Névjegy komponens kezeli, amely argumentumként kerül átadásra az Útvonal komponensnek.

7.” és „” – Ezek a sorok az útvonalakat és a router-összetevőket is lezárják

Mi az IndexRedirect

Az IndexRedirect a React Router egyik összetevője, amely lehetővé teszi az egyik útvonalról a másikra való átirányítást. Akkor használatos, ha a felhasználót az alkalmazás gyökér URL-jéről egy másik útvonalra szeretné átirányítani. Például, ha van egy alkalmazása, amelynek gyökér URL-je „/”, az IndexRedirect segítségével átirányíthatja a felhasználót a „/home” címre, amikor meglátogatja a gyökér URL-t.

Hogyan kell csinálni az IndexRedirect

Az IndexRedirect a React Routerben egy módja annak, hogy a felhasználókat az alkalmazás gyökér URL-jéről egy másik URL-re irányítsa át. Ez hasznos lehet, ha az alkalmazás legfontosabb oldalára irányítja a felhasználókat, vagy létrehoz egy céloldalt.

Az IndexRedirect végrehajtásához a React Routerben a összetevő. Ez a komponens két kelléket igényel: „to” és „push”. A „to” prop annak az URL-címnek a meghatározására szolgál, amelyre a felhasználókat át szeretné irányítani, míg a „push” paraméter határozza meg, hogy a böngészési előzményeket frissíteni kell-e, amikor ez az átirányítás történik (alapértelmezés szerint igaz).

Például, ha azt szeretné, hogy az Ön gyökér URL-jét (pl. www.example.com) felkereső felhasználók a www.example.com/home címre legyenek átirányítva, használhatja a következőhöz hasonló IndexRedirectet:




… más útvonalak…

Kapcsolódó hozzászólások:

Írj hozzászólást