Ich habe zwei Komponenten (Liste und Detail):
List.js:
%Vor%Detail.js:
%Vor%Ich hätte gerne zwei Bildschirme (NowList und SoonList), die im Grunde die gleiche Art von Liste sind, also benutze ich die gleiche List-Komponente für beide Bildschirme. Und von jedem dieser Bildschirme möchte ich zu den Details des Elements navigieren, das in diesem Fall den gleichen Layouttyp hat, sodass ich die Detailkomponente für beide Listenelemente verwende.
Schließlich, wenn die App startet, möchte ich, dass der NowList-Bildschirm angezeigt wird. Und mit der Schublade möchte ich zum SoonList-Bildschirm navigieren.
Ich bin mir nicht sicher, wie ich diese Route konfigurieren soll. Aber so habe ich die Routen für jetzt konfiguriert:
%Vor%Wenn ich von der NowList-Route zur Detailroute navigiere. Es gibt eine Zurück-Schaltfläche in der Detail-Route, die beim Drücken zurück zur NowList navigiert.
Wenn ich jedoch zur Soon-Route gehe und zur Detailroute navigiere, gehe ich zum Detailbildschirm. Aber wenn ich die Zurück-Taste in der Kopfzeile der Detail-Navigation drücke, navigiere ich nicht zum SoonList-Bildschirm, sondern zum NowList-Bildschirm.
Ich denke, ich vermisse etwas hier, oder mein Routenlayout ist nicht so, wie es sein soll. Können Sie mir helfen, die Routen so zu konfigurieren, dass ich DrawerNavigator verwenden kann, um zu verschiedenen Bildschirmen zu navigieren, und von diesen Bildschirmen zu einem anderen Bildschirm und wieder zurück zum Bildschirm navigiert von?
Ihr Routenlayout gibt keinen Detail -Bildschirm im SoonStack -Navigator an. Wenn Sie zu Detail navigieren, navigiert react-navigation zum einzigen Bildschirm, der auf diese Weise benannt ist. Da es in NowStack ist, kehrt die Rückkehr zum ersten Bildschirm im Stapel zurück.
Um das Problem zu lösen, können Sie dem Detail -Navigator einen weiteren SoonStack -Bildschirm hinzufügen, aber Sie möchten ihn entweder anders benennen oder mit dem Schlüssel zu jedem Detail -Bildschirm navigieren.
Um zum richtigen Detail -Bildschirm navigieren zu können, können Sie jedem Stack-Navigator einen Parameter hinzufügen.
Zum Beispiel:
%Vor%Sie können dann mit dem Parameter zum richtigen Bildschirm navigieren.
Außerdem ist es möglich, nur ein einziges StackNavigator mit den drei verschiedenen Bildschirmen darin zu verwenden und reset den Stapel beim Umschalten mit der Schublade auf den richtigen Bildschirm.
Sie können mehr über reset hier lesen.
Verwendung von reset
Wenn Sie einen einzelnen Stack-Navigator haben:
%Vor% Dann kann die Schublade den Stapelzustand auf den von Ihnen gewünschten Wert zurücksetzen. Wenn beispielsweise der erste Bildschirm NowList und SoonList in der Schublade angeklickt wurde, können Sie Folgendes aufrufen:
Dies würde dazu führen, dass der Stack zurückgesetzt wird und SoonList als erster Bildschirm angezeigt wird. Wenn Details geöffnet sind, ist es die zweite im Stapel und die Rückseite wird immer zum richtigen Bildschirm zurückkehren.
Tags und Links react-native react-navigation