Wie können wir also Informationen über die Kategorie erhalten, auf
die wir geklickt haben? Auf dem Kategorienbildschirm, auf dem wir zu
Kategoriemahlzeiten navigieren, können
wir für diese Navigationsaktion neben dem Routennamen auch die Parameter übergeben.
Dies ist ein weiterer Schlüssel, den dieses Objekt, an das Sie zum Navigieren übergeben haben, akzeptiert. Dabei handelt es sich
um ein Objekt aus Schlüssel-Wert-Paaren, beliebigen Schlüssel-Wert-Paaren und so vielen Schlüssel-Wert-Paaren, wie Sie möchten.
Dies sind also einfach Parameter, zusätzliche Daten, die Sie an den neuen Bildschirm übergeben, der geladen wird.
Jetzt können Sie einen Parameter mit dem Namen Kategorie-ID einrichten, und der Name liegt ganz bei Ihnen.
Dies kann nur
ID, CID oder mein Hobby sein. Was auch immer Sie erstellen und welche Daten Sie weiterleiten müssen, hier leiten wir weiter
eine Kategorie ID daher werde ich es so nennen.
Dies sollte nun in unserem Szenario hier natürlich die ID der
Kategorie sein, auf die wir getippt haben.
Jetzt erhalten wir hier natürlich unsere Artikeldaten für jedes gerenderte Rasterelement.
Dieses enthält das Element und hat einen Titel, eine Farbe und eine ID. Die Kategorie-ID
lautet also itemData. Artikel. Ich würde.
Jetzt leiten wir diese ID an den neuen Bildschirm weiter, der geladen wird, und das ist hier
natürlich wichtig. Dadurch können wir diese
Daten dann in diesem neuen Bildschirm verwenden. Wie? Nun, gehen wir dorthin, gehen wir zum
Bildschirm für die Kategorie Mahlzeiten und sehen, wie wir diesen Parameter extrahieren können.
Wir wissen, dass wir eine
bekommen werden. Wie können wir jetzt darauf zugreifen?
Dafür können wir wieder die Requisitennavigation
verwenden, daher erhalten wir diese spezielle Requisite, da diese Komponente hier mit Hilfe eines React-Navigationsnavigators
geladen wird und wir bei der Navigation nicht nur navigieren und drücken müssen und so weiter. Wir haben
auch getParam, eine Methode zum Extrahieren eines Parameters, den wir erhalten. getParam verwendet eine Zeichenfolge mit dem Namen des Parameters, den wir
extrahieren möchten, und dies sollte natürlich der Name sein, den Sie hier als
Schlüssel für dieses params-Objekt ausgewählt haben.
Also habe ich hier eine Kategorie-ID hinzugefügt, daher ist dies der Name, den ich hier verwenden möchte.
Dies gibt mir die Katzen-ID, diese Kategorie-ID. Dies gibt mir den Wert, den wir hier unter diesem Schlüsselnamen speichern. In diesem Fall
ist dies die
ID.
Dies ist also der Wert,
den wir für die Kategorie-ID in der Kategorie extrahieren Mahlzeiten Bildschirm.
Jetzt haben wir also die Katzen-ID und können diese verwenden, um natürlich Zugang zu allen Mahlzeiten zu erhalten, die in diese Kategorie
passen. Im
Moment haben wir keine Mahlzeiten, also müssen wir dies verschieben, aber zumindest können wir dies auch verwenden
Um unseren Kategorietitel zu erhalten und diesen hier und dafür zu verwenden, müssen wir natürlich nur Kategorien importieren, also ordnen wir
unsere Kategorien hier aus Daten / Dummy-Daten an und wir haben die ID, wir haben eine Reihe von Kategorien Natürlich können wir unsere ausgewählte Kategorie finden
oder was auch immer Sie sie benennen möchten, indem wir uns Kategorien ansehen, und dort können wir find verwenden, das eine
Funktion übernimmt, die es für jedes Element im Array ausführt, also für jede Kategorie und uns gibt
Das Element, bei dem diese Funktion true zurückgibt. Dies sollte der Fall sein, wenn die ID
für die Kategorie, die wir betrachten, mit der Katzen-ID übereinstimmt, die wir aus unseren Parametern abrufen.
Dies gibt uns die ausgewählte Kategorie und um zu
beweisen, dass dies funktioniert, werde ich sie hier in einer Textkomponente ausgeben, ich werde selectedCategory ausgeben.
Titel hier. Wenn wir also zurückgehen und zu dieser Kategorie navigieren, sehen wir hier Italienisch direkt
über meinen Schaltflächen. Wir sehen jetzt schnell
und einfach, also funktioniert das. Auf diese Weise geben wir
Daten weiter und extrahieren sie. Natürlich können Sie mehrere Parameter übergeben, so viele Sie benötigen
und Parameter müssen keine IDs sein. Sie können Objekte übergeben, Sie können Text übergeben. Zahlen und Arrays, unabhängig
davon, welche Daten Sie übergeben müssen, können Sie übergeben. Sie werden jedoch vielleicht bemerken, dass wir damit natürlich unsere Kategorie hier in unserem Bildschirm verwenden
können, aber wir möchten sie hier in der Kopfzeile verwenden.
Lassen Sie uns das in der nächsten Vorlesung angehen.