So implementieren Sie den React-Router-Dom-Routensprung

Die Implementierungsmethode des React-Router-Dom-Routensprungs: 1. Öffnen Sie die entsprechende js-Datei. 2. Führen Sie den Routensprung manuell über die useNavigate-Methode aus. 3. Übergeben Sie den Routenwert über das Statusattribut und verwenden Sie die useLocation-Methode um die Parameter zu erhalten.

Die Betriebsumgebung dieses Tutorials: Windows 10-System, Reaktionsversion 18.0.0, Dell G3-Computer.

Wie implementiert man einen Routensprung in React-Router-Dom?

React-Router-dom Routensprung

useNavigate

useNavigate-Methode kann manuell für den Routensprung bedient werden und kann zwischen verschiedenen Seiten wechseln

AttributBeschreibung Ersetzen Sie Route Verlauf, wenn der Wert wahr ist, werden keine Verlaufseinträge erstellt StatusÜbergabewert weiterleiten, Parameterparameter übergeben Versuchen Sie es mit CodeSandBox

Der Standardwert des Ersetzungsattributs ist falsch, verwenden Sie { replace:true}, damit wir keinen weiteren Eintrag im Verlaufsstapel der Anmeldeseite erstellen. Das heißt, wenn sie die geschützte Seite erreichen und auf die Schaltfläche „Zurück“ klicken, werden sie nicht zur Anmeldeseite zurückgeleitet

Das Statusattribut wird weitergeleitet und als params-Parameter übergeben, der nicht hinter der URL und angezeigt wird Die Seite wird aktualisiert. Parameter gehen verloren. Auf anderen Seiten verwenden wir die useLocation-Methode, um Parameter abzurufen

Empfohlenes Lernen: „

Video-Tutorial reagieren“

Das obige ist der detaillierte Inhalt vonSo implementieren Sie den React-Router-Dom-Routensprung. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!