Jetzt arbeiten wir ziemlich viel mit der Navigation und können uns vorwärts und rückwärts bewegen.
Hier erfahren Sie, wie Sie diesem Header Symbole und Aktionsschaltflächen hinzufügen, wie Sie den Header im Allgemeinen formatieren und steuern und wie Sie Daten
weitergeben. Dies sind alles wichtige Dinge für mobile Apps, die Sie mit React Native erstellen. Natürlich sind dies
Dinge, die Sie tun werden Führen Sie dies immer wieder durch, wenn Sie mit React Native arbeiten,
um Apps zu erstellen.
Dies ist nicht die einzige Form der Navigation, die wir implementieren können, obwohl wir auch unten auf tippen können,
um zwischen verschiedenen Abschnitten in seiner App zu wechseln, die natürlich alle ein typisches
Muster aufweisen, das Sie von mobilen Apps kennen, und das auch das Muster ist Ich habe zu
Beginn dieses Moduls skizziert, dass ich zwei Taps in seiner App haben möchte, einen für alle unsere Mahlzeiten oder in diesem Fall alle
unsere Kategorien und einen für nur unsere Lieblingsgerichte, die Mahlzeiten, die wir als Favoriten markiert haben.
Das bringt uns natürlich zu einer wichtigen Frage, wie wir bei der Arbeit mit der Reaktionsnavigation Taps hinzufügen können.
Und das ist zum Glück nicht allzu schwierig.
Gehen wir zu unserer James-Datei für den Essensnavigator, in der wir die Navigation eingerichtet und dort
einen Stapelnavigator erstellt haben.
Sie benötigen einen Stapel-Navigator, wenn in Ihrer App Bildschirmseiten vorhanden sind, die mit einem solchen
Vorwärts-Rückwärts-Fluss verbunden sind.
Das ist die typische Stack-Navigation.
Was wir hier verwenden, wird das natürlich noch brauchen, auch wenn wir jetzt alle Anzeigen abhören.
Das Gute ist, dass Sie einfach mehrere Navigatoren in Ihrer Anwendung haben können, und
das ist jetzt genau richtig für die Rick-Navigation neben dem Stapel-Navigator, der die Stapel-Navigator-Funktion erstellt.
Wir können auch den Navigator zum Erstellen von unteren Registerkarten importieren. Auf diese Weise können wir einen Navigator
erstellen, der mit Tippen am unteren Rand funktioniert.
Erstellen Sie also den unteren Tab-Navigator, und wir können einfach diesen zusätzlichen Navigator neben unserem Essensnavigator erstellen. Sagen
wir, hier werde ich den Pfaff-Tab-Navigator für Mahlzeiten nennen. Sie können ihn so benennen, wie Sie möchten, um wirklich klar
zu sein, was sein Navigator ist Steuerelemente und Radsteuerelemente sind Mahlzeiten und Favoriten mit
Tippen, und ich rufe den Navigator für die untere Registerkarte erstellen auf und speichere das Ergebnis davon in dieser
Konstante.
Das Ergebnis dieser Gerechtigkeit für den Stack-Navigator ist nicht das Ende einer Reaktionskomponente.
Also können wir das hier speichern und wir werden bald in der Lage sein, die Entfernung zu nutzen.
Wie konfigurieren wir nun diesen Tab-Navigator? Wie der Stack-Navigator nimmt auch der Tab-Navigator das Objekt, in dem wir
es über die verschiedenen Taps informieren müssen, sozusagen die verschiedenen Abschnitte auf verschiedene Bildschirme, die Sie laden
möchten, wenn wir auf verschiedene klicken tippen und dort habe ich zwei Registerkarten, von denen ich möchte, dass
eine Registerkarte das ist, was wir hier sehen.
Also unser Stack am Ende nicht nur dieser Bildschirm, sondern alle Funktionen, um zu einem anderen Bildschirm zu wechseln.
Ich möchte also den gesamten Stapel hier auf einer Registerkarte und einen anderen Bildschirm oder einen
anderen Stapel auf der Registerkarte Abbott haben. Das Gute ist, dass Sie in diesem Navigator einen Stapel oder einen anderen Navigator als Bildschirm verwenden können.
Hier können Sie also eine Kennung einrichten.
Nennen wir es vielleicht Mahlzeiten.
Das liegt ganz bei Ihnen.
Und jetzt können Sie hier auf einen Bildschirm zeigen.
Sie können dieses lange Formular auch mit Bildschirm verwenden, aber ich verwende die Verknüpfung und zeige direkt
auf einen Bildschirm hier auf dem Bildschirm. Hinzufügen, auf den Sie hier zeigen, kann sogar nur eine Reaktionskomponente sein, wie wir sie hier im
Bildschirmordner oder erstellt haben.
Nun, seit diesem Jahr, wie ich bereits erwähnte, sind alle Renditen eine echte Komponente.
Dies kann auch das Ergebnis von create stack Navigator sein.
In der Tat werde ich hier den Essensnavigator als meinen Bildschirm verwenden, um für die Registerkarte Mahlzeiten geladen zu werden.
In der Tat funktioniert es so, wie wir dies einrichten können.
Das ist also unser erster Tipp.
Die zweite Registerkarte wird unsere Favoriten sein und dort.
Ich habe noch keinen Stapel.
Wir werden vielleicht später einen hinzufügen, aber jetzt zeige ich nur auf den Favoritenbildschirm, also importieren wir tote Favoriten.
Bildschirm hier in der Mahlzeit Navigator Datei Import Favoriten Bildschirm aus dem Bildschirm Ordner und sie sind Favoriten
Bildschirm wie folgt.
Zeigen Sie jetzt einfach auf den Favoritenbildschirm, um unsere Favoriten-ID im unteren Registerkarten-Navigator anzuzeigen.
So einfach können wir einen Tab Navigator einrichten.
Die Frage ist nun, wie wir es verwenden.
Nun, am Ende ist es jetzt dieser Navigator, den wir als Routennavigator in der App verwenden
möchten, da er unseren vorhandenen Essensnavigator enthält.
Außerdem können wir zum Lieblingsbildschirm wechseln.
Letztendlich verwende ich dieses Jahr nur in meinem App-Container anstelle des Essensnavigators, da der
Essensnavigator jetzt in diesem Registerkartennavigator verschachtelt ist. Auf diese Weise können Sie mehrere Navigatoren in einer nativen App
kombinieren, die von der Rack-Navigation gesteuert wird, weil Sie dies einfach können mischen und zusammenpassen.
Sie haben immer einen Routennavigator in Ihrem App-Container und das macht Sinn, dass Sie einen Einstiegspunkt in Ihre
App haben, aber dieser Routennavigator kann natürlich unsere verschachtelten Navigatoren haben, wie wir sie hier für diesen Tipp haben, wo wir auf den
Essensnavigator zeigen und wenn wir dies jetzt sicher speichern und unsere App daher neu startet, sehen Sie jetzt, dass wir
hier unten Registerkarten haben und wir können darauf klicken, um zu unserem Essensstapel hier zu gelangen, und
wir können diesen Stapel wie zuvor verwenden, aber ich kann auch zu Favoriten wechseln Gehen Sie zurück zu meinem Stapel, in
dem sogar angegeben ist, dass er sich befindet, und so einfach können wir Aufgaben hinzufügen.
Das gleiche gilt natürlich auch für Android.
Jetzt ist es natürlich auch bemerkenswert, dass diese Taps nicht richtig aussehen, aber es wäre schön, wenn ich sie
hören könnte und nicht nur einen Text, und wir werden uns um die Konfiguration dieser Taps kümmern.
Nur eine Sekunde, aber so einfach können wir mit Tippen beginnen. So können
Sie über die Verwendung mehrerer Navigatoren in einer Reaktionsnavigations-App oder in der App mit Reaktionsnavigation nachdenken.
Nun wollen wir sehen, wie wir tatsächlich Symbole hinzufügen können und wie wir unsere Wasserhähne ein bisschen mehr konfigurieren können, um
auch eine andere Farbe als dieses standardmäßige blaue Jahr zu verwenden.