Aus dem Kurs: React Grundkurs

So erhalten Sie Zugriff auf diesen Kurs

Werden Sie noch heute Mitglied und erhalten Sie Zugriff auf mehr als 24.700 Kurse von Branchenfachleuten.

Solution: React Router mit Search-Parametern nutzen

Solution: React Router mit Search-Parametern nutzen – Tutorial zu React.js

Aus dem Kurs: React Grundkurs

Gratismonat starten Für Ihr Team erwerben

Solution: React Router mit Search-Parametern nutzen

“

(Upbeat-Musik) In dieser Challenge wollen wir einen Kommentar aus dem Query-Parameter der URL auslesen. Wenn Sie die Vorlage aus dem Git-Repository geöffnet haben, finden Sie unter SinglePhoto.jsx einen Link zur Dokumentation von reactrouters useSearchParam-Hook. Unter dem Bild finden Sie einen statischen Kommentar, ein Input-Feld und einen Button. Wir wollen nun einmal einen Query-Parameter manuell zur URL hinzufügen. Dazu gehen wir ans Ende der URL und schreiben "comment=Hallo Router", dann drücken wir Enter. Um diesen Wert nun auszulesen, nutzen wir den Hook useSearchParam. Ähnlich wie useState liefert dieser Hook ein Array zurück. Um nun Zugriff auf den Query-Parameter mit dem Namen comment zu bekommen, rufen wir searchParams.get auf. Dann übergeben wir den Namen von dem Parameter, den wir haben wollen und das Ganze weisen wir einer Variable zu. Diese Variable können wir nun unten im Template verwenden. Die erste Aufgabe wurde damit schon gelöst. Wir sehen hier den Kommentar…

Inhalt