Rešeno: react router 6 navigate

Glavna težava, povezana z navigacijo React Router 6, je ta, da ne zagotavlja načina za posredovanje rekvizitov ali stanja ciljni poti. To pomeni, da če morate posredovati podatke z ene poti na drugo, morate uporabiti knjižnico, kot je React Query ali Redux. Poleg tega navigacijski sistem temelji na URL-jih in ne na komponentah, zato je lahko razvijalcem, ki so navajeni delati s komponentami namesto z URL-ji, težko.

import { useHistory } from "react-router-dom";

const history = useHistory();

history.navigate("/path/to/page");

1. Ta vrstica uvozi kljuko useHistory iz knjižnice react-router-dom.
2. Ta vrstica ustvari novo konstanto, imenovano history, in jo dodeli kljuki useHistory.
3. Ta vrstica uporablja konstanto zgodovine za navigacijo do določene poti, v tem primeru »/path/to/page«.

Krmarjenje

React Router je zmogljiva usmerjevalna knjižnica, zgrajena na vrhu Reacta, ki razvijalcem pomaga pri ustvarjanju, upravljanju in upravljanju navigacije v njihovih aplikacijah. Zagotavlja popolno rešitev usmerjanja za aplikacije React s funkcijami, kot so dinamično ujemanje poti, obravnavanje prehodov lokacij, obnovitev drsenja in drugo. Navigate je pomemben del React Routerja, ki razvijalcem omogoča programsko krmarjenje med različnimi potmi v njihovi aplikaciji. Zagotavlja API za navigacijo med potmi z uporabo predmeta zgodovine ali z neposrednim podajanjem imena poti. Z Navigate lahko razvijalci preprosto ustvarijo povezave do drugih strani v svoji aplikaciji in uporabnikom omogočijo preklapljanje med različnimi pogledi brez ponovnega nalaganja strani.

Kako krmarim z usmerjevalnikom React?

Navigacija z React Routerjem je preprost postopek. Za začetek boste morali namestiti paket React Router iz npm. Ko je nameščen, lahko uporabljate komponento za določanje poti v vaši aplikaciji. The komponenta ima dva elementa: pot in komponento. Pot prop definira pot URL, ki bo sprožila pot, komponenta prop pa je komponenta React, ki bo upodobljena, ko se ta pot ujema.

Uporabite lahko tudi druge komponente, kot je npr , in da dodatno prilagodite svojo izkušnjo usmerjanja. The vam omogoča ustvarjanje povezav med različnimi potmi v vaši aplikaciji, medtem ko komponenta omogoča preusmeritev uporabnikov z ene poti na drugo. Končno, vam omogoča, da upodabljate samo eno od več komponent glede na to, katera pot se prva ujema.

Skupna uporaba teh komponent vam omogoča močan nadzor nad tem, kako uporabniki krmarijo po vaši aplikaciji, in jim zagotavlja intuitiven način, da to storijo.