1 00:00:02,280 --> 00:00:03,340 Jetzt abmelden. 2 00:00:04,290 --> 00:00:06,840 Wir brauchen eine neue Aktion, die wir versenden können. 3 00:00:07,230 --> 00:00:10,140 Also in der Aus-Datei, im Aktionsordner. 4 00:00:11,760 --> 00:00:14,020 Ich werde einen neuen Aktionsersteller hinzufügen. 5 00:00:14,050 --> 00:00:21,610 Ist es wirklich wichtig, wo Sie hinzugefügt haben? Ich habe es dort unten hinzugefügt und exportiere es und benenne es als Abmeldung, was für mich nach 6 00:00:22,300 --> 00:00:23,650 einem passenden Namen klingt. 7 00:00:26,330 --> 00:00:27,710 Ich erwarte dort keine Argumente. 8 00:00:28,250 --> 00:00:31,180 Und ich brauche die Aktionskennung zum Abmelden. 9 00:00:31,220 --> 00:00:33,410 Hier können wir also exportieren. 10 00:00:36,310 --> 00:00:40,030 Konzert abmelden mit der Abmeldezeichenfolge. 11 00:00:41,300 --> 00:00:42,850 Und jetzt stehst du da unten. 12 00:00:43,270 --> 00:00:48,510 Und in diesem Aktionsersteller, der ein normaler Aktionsersteller ist, bei dem ich keine HTP-Anforderungen 13 00:00:48,520 --> 00:00:54,460 oder ähnliches senden muss, habe ich gerade seine Abmeldeaktion Yende gesendet, in der ich dieses Abmeldeaktionsobjekt 14 00:00:54,460 --> 00:00:55,000 erstelle. 15 00:00:57,410 --> 00:00:58,520 Jetzt können wir Papa benutzen. 16 00:00:59,540 --> 00:01:04,130 Und ich möchte mich mit Hilfe der Site abmelden, auf der Site zeichnen, zeichnen können. 17 00:01:04,190 --> 00:01:06,590 Ich möchte diese Schaltfläche zum Abmelden haben. 18 00:01:06,860 --> 00:01:09,650 Das bedeutet, dass wir etwas tun müssen, was wir vorher noch nicht getan haben. 19 00:01:10,460 --> 00:01:13,210 Wir müssen einen neuen Button hinzufügen, um über das Zeichnen zu entscheiden. 20 00:01:13,370 --> 00:01:16,030 Bisher fügen wir nur die automatisch erstellten Schaltflächen hinzu. 21 00:01:17,850 --> 00:01:21,470 Aber das Hinzufügen eigener Inhalte ist für Papa nicht allzu schwierig. 22 00:01:21,540 --> 00:01:24,410 Gehen wir zur Shop Navigator-Datei, in der wir die Schublade eingerichtet haben. 23 00:01:25,080 --> 00:01:25,740 Hier ist es. 24 00:01:27,560 --> 00:01:30,800 Und dann hier neben meinen Inhaltsoptionen. 25 00:01:31,800 --> 00:01:34,770 Sie können hier auch eine Inhaltskomponente hinzufügen. 26 00:01:36,290 --> 00:01:41,630 Auf diese Weise können Sie Ihren eigenen Inhalt zur Entscheidung oder anstelle des Standardinhalts hinzufügen. 27 00:01:42,320 --> 00:01:46,790 Dies übernimmt nun eine Funktion, die Requisiten erhält, da dies letztendlich eine Reaktionskomponente ist, die Sie 28 00:01:46,790 --> 00:01:47,450 hier hinzufügen. 29 00:01:48,850 --> 00:01:54,280 Also bekommt es Requisiten und es gibt Steuererklärungen, ich bin J. S. X, und sie müssen alle sicherstellen, dass Sie 30 00:01:54,280 --> 00:01:55,300 Reagieren von Reagieren importieren. 31 00:01:55,690 --> 00:01:57,670 Und wir brauchen alle noch ein paar andere Importe. 32 00:01:58,960 --> 00:02:01,250 Wir müssen auch etwas von React Native importieren. 33 00:02:01,270 --> 00:02:03,160 Und das sollte die sichere Bereichsansicht sein. 34 00:02:04,580 --> 00:02:09,380 Und ich möchte auch die Schaltfläche aus REAC native importieren. 35 00:02:11,000 --> 00:02:16,550 Außerdem müssen wir aus REACT Navigation die Schubladenelemente importieren. 36 00:02:18,060 --> 00:02:20,080 Und auch wieder sehr einheimisch. 37 00:02:20,340 --> 00:02:21,300 Ich muss auch sehen. 38 00:02:22,960 --> 00:02:27,970 Nachdem dies importiert wurde, gehen wir zu unserer neu hinzugefügten Inhaltskomponente. 39 00:02:28,930 --> 00:02:35,140 Und hier können wir jetzt eine Ansicht mit einem flexiblen Stil zurückgeben. 40 00:02:35,470 --> 00:02:36,940 Sie können natürlich auch ein Stylesheet hinzufügen. 41 00:02:36,970 --> 00:02:38,950 Ich werde nur Inline-Styling hinzufügen. 42 00:02:39,130 --> 00:02:42,860 Übrigens könnte sich diese Komponente natürlich auch in einer separaten Datei befinden. 43 00:02:42,880 --> 00:02:45,850 Es muss in diesem Herbst nicht sofort erstellt werden. 44 00:02:47,620 --> 00:02:55,870 In dieser Ansicht möchte ich eine sichere Bereichsansicht haben und dort sicherstellen, dass Sie immer einen Krafteinsatz hinzufügen, der 45 00:02:56,710 --> 00:02:58,540 gleich oben ist. 46 00:02:59,890 --> 00:03:01,060 Horizontal. 47 00:03:01,510 --> 00:03:03,970 Niemals, und dies steuert nur, wie es angeordnet ist. 48 00:03:05,330 --> 00:03:07,620 Und in dieser sicheren Umgebung. 49 00:03:08,850 --> 00:03:16,020 Sie sollten jetzt zum Zeichnen Elemente hinzufügen, eine wichtige Pass-Requisite für diese, da dies die Standard-Schubladenelemente sind, 50 00:03:16,020 --> 00:03:17,400 die gerendert werden. 51 00:03:17,450 --> 00:03:18,780 Und das sollte immer noch der Fall sein. 52 00:03:19,200 --> 00:03:24,850 Und damit sie richtig konfiguriert werden, müssen Sie Requisiten übergeben, die am Ende übergeben werden, und durch Reagieren 53 00:03:24,850 --> 00:03:28,410 der Navigation und halten alle Ihre Ziehkontakte und so weiter. 54 00:03:29,040 --> 00:03:31,680 Und jetzt können Sie hier Ihren eigenen zusätzlichen Ziehungsgegenstand hinzufügen. 55 00:03:32,130 --> 00:03:37,510 Und es wird diese Schaltfläche geben, die standardmäßige native Schaltfläche zum Reagieren, bei der ich Abmelden sage. 56 00:03:38,510 --> 00:03:45,580 Wo ich eine Farbe hinzufügen möchte, sagen wir Farben, Primärpunkt und Verschleiß auf der Druckmaschine. 57 00:03:45,640 --> 00:03:48,100 Ich möchte jetzt diese Abmeldeaktion auslösen. 58 00:03:49,640 --> 00:03:51,440 Und jetzt haben wir hier ein großes Problem. 59 00:03:52,220 --> 00:03:54,160 Wie können wir uns von hier aus versenden? 60 00:03:54,400 --> 00:03:56,870 Wenn Sie dies speichern, sollten Sie dies zunächst einmal sehen. 61 00:03:56,900 --> 00:04:00,050 Wenn Sie also die Auslosung erweitern, finden Sie hier die Schaltfläche zum Abmelden. 62 00:04:00,140 --> 00:04:00,350 Recht. 63 00:04:00,380 --> 00:04:01,220 Das funktioniert also. 64 00:04:01,460 --> 00:04:04,250 Und natürlich können Sie stylen und positionieren, wie Sie wollen. 65 00:04:06,680 --> 00:04:08,400 Übrigens, überprüfen Sie es einfach noch einmal. 66 00:04:08,420 --> 00:04:11,540 Wir können dies auch auf Android sehen, wenn wir uns dort anmelden. 67 00:04:16,210 --> 00:04:18,580 Hier in der Schublade machen wir alle nach dem Abmelden. 68 00:04:20,120 --> 00:04:20,540 Taste. 69 00:04:22,280 --> 00:04:25,840 Übrigens möchten wir vielleicht etwas mehr Polsterung auf der Oberseite hinzufügen. 70 00:04:27,800 --> 00:04:29,590 Aber wie können wir alles versenden? 71 00:04:29,750 --> 00:04:32,120 Und ich werde hier etwas zusätzliche Polsterung hinzufügen. 72 00:04:34,060 --> 00:04:34,990 Von 20. 73 00:04:38,300 --> 00:04:43,520 Weil meine sichere Bereichsansicht funktioniert, aber kaum mehr Abstand lässt, als ich brauche. 74 00:04:43,790 --> 00:04:48,110 Um einen zusätzlichen Abstand zu haben, kann ein bisschen Polsterung nicht schaden. 75 00:04:50,880 --> 00:04:51,750 Ich denke das ist besser. 76 00:04:52,260 --> 00:04:56,010 Aber wie können wir jetzt wieder sicherstellen, dass wir hier eine Aktion auslösen können? 77 00:04:57,360 --> 00:04:59,210 Nun, das ist eine Reaktionskomponente, oder? 78 00:04:59,880 --> 00:05:03,570 Am Ende können wir hier also einfach den Versand verwenden. 79 00:05:05,770 --> 00:05:07,060 So können wir importieren. 80 00:05:09,150 --> 00:05:10,530 Verwenden Sie hier den Versand. 81 00:05:11,620 --> 00:05:13,150 Aus Redux reagieren. 82 00:05:13,240 --> 00:05:19,210 Also, was wir vorher gemacht und hier verwendet haben, weil Sie diesen Hook an jeder Komponente verwenden können und dies nur 83 00:05:19,210 --> 00:05:20,260 eine Komponente ist. 84 00:05:22,250 --> 00:05:24,540 Jedes Jahr vor unserer Rückkehr ist also X. 85 00:05:24,830 --> 00:05:30,920 Ich kann mit Use Dispatch auf meine Versandfunktion zugreifen und habe vorerst hier, wenn wir diesen 86 00:05:30,920 --> 00:05:36,020 Knopf drücken, können wir den Versand anrufen und unsere Aus-Aktion für Papa versenden. 87 00:05:36,050 --> 00:05:38,090 Natürlich müssen Sie nur sicherstellen, dass Sie es importieren. 88 00:05:38,810 --> 00:05:49,330 Importieren Sie also alles ab Aktionen aus dem Speicherordner, der Aktionsordner erledigt alle Dateien und verwendet jetzt alle Aktionen, um 89 00:05:49,330 --> 00:05:52,400 hier tote Aktionen zu erstellen. 90 00:05:52,430 --> 00:05:53,410 Alle Aktionen gespeichert. 91 00:05:53,420 --> 00:05:54,200 Ausloggen. 92 00:05:54,560 --> 00:05:55,780 Melden Sie sich so ab. 93 00:05:57,230 --> 00:05:59,160 Und dies sollte zur Abmeldeaktion gesendet werden. 94 00:05:59,700 --> 00:06:05,860 Außerdem möchte ich auch weg navigieren, damit wir alle so genannten Requisiten navigieren können. 95 00:06:06,240 --> 00:06:10,440 Das wird hier verfügbar sein und hier zum Off-Screen zurückkehren. 96 00:06:11,190 --> 00:06:14,580 Also im Grunde zu diesem Off-Screen hier und dem Switch-Navigator. 97 00:06:14,900 --> 00:06:17,050 Unsere Verlosung ist Teil des Shop Navigators. 98 00:06:17,250 --> 00:06:19,770 Von dort aus können wir auch zum Off-Screen gehen. 99 00:06:21,540 --> 00:06:26,850 Wenn wir uns jetzt abmelden, möchte ich sicherstellen, dass wir im Reduzierer auch etwas tun. 100 00:06:27,240 --> 00:06:30,660 Wir haben hier unseren Abmeldeaktionsersteller. 101 00:06:30,930 --> 00:06:35,720 Also im Reduzierer und Sie boten dem Benutzer einen neuen Fall an, um den Fall abzumelden. 102 00:06:35,750 --> 00:06:39,060 Und für Papa sollten Sie sicherstellen, dass Sie die Abmeldekennung importieren. 103 00:06:39,900 --> 00:06:41,380 Und hier ist es natürlich sehr einfach. 104 00:06:41,400 --> 00:06:46,440 Ich gebe meinen Ausgangszustand zurück, was am Ende bedeutet, dass das Token zurückgesetzt wird und der Benutzer I. D. D. wird zurückgesetzt. 105 00:06:48,300 --> 00:06:49,510 Und jetzt versuchen wir es mal. 106 00:06:49,540 --> 00:06:56,050 Wenn ich hierher zurückgehe und jetzt auf Abmelden klicke, bin ich wieder auf dem Off-Bildschirm, damit das funktioniert. 107 00:06:56,350 --> 00:06:58,180 Probieren wir es auch mit Android aus. 108 00:07:01,330 --> 00:07:03,790 Klicken Sie hier auf Abmelden, wir sind zurück. 109 00:07:04,480 --> 00:07:05,470 Das funktioniert also. 110 00:07:06,250 --> 00:07:07,930 Damit sind wir fast da. 111 00:07:08,650 --> 00:07:15,640 Wir sollten aber auch automatisch gesperrt werden, wenn das Token abgelaufen ist, weil es ein Ablaufdatum hat. 112 00:07:15,820 --> 00:07:18,250 Und im Moment haben wir keinen automatischen Ablauf.