1 00:00:02,380 --> 00:00:04,460 Um zu überprüfen, was der Benutzer 2 00:00:04,480 --> 00:00:07,680 eingegeben hat, möchte ich natürlich bei jedem Tastendruck etwas tun. 3 00:00:07,690 --> 00:00:11,740 Jetzt haben wir onChangeText hier bereits als Listener für den Titel 4 00:00:11,740 --> 00:00:15,700 und zum Beispiel setzen wir den Titel in unserem Status. 5 00:00:15,790 --> 00:00:18,700 Der nächste Schritt besteht nun darin, dies nicht nur 6 00:00:18,700 --> 00:00:25,270 zu tun, sondern die Eingabe nicht nur zu speichern, sondern auch zu validieren und die Gültigkeit dieser Eingabe in einem bestimmten 7 00:00:25,510 --> 00:00:26,780 Zustand zu verwalten. 8 00:00:26,860 --> 00:00:36,620 Daher füge ich hier eine neue Funktion hinzu, zum Beispiel einen Titeländerungs-Handler, der den eingegebenen Text abruft und dann etwas tun kann, und ich lagere dies einfach 9 00:00:36,620 --> 00:00:41,870 in eine separate benannte Funktion aus, um ein bisschen sauberer und leichter zu folgen 10 00:00:41,870 --> 00:00:48,830 entlang des Codes, weil ich diesen Listener jetzt hier an mein onChangeText-Ereignis binden werde, so dass diese Funktion bei 11 00:00:48,830 --> 00:00:55,610 jedem Tastendruck ausgelöst wird und ich dort natürlich immer noch meinen Titel mit dem Text festlegen werde, aber jetzt 12 00:00:55,610 --> 00:00:56,290 möchte 13 00:00:56,300 --> 00:01:00,220 ich zusätzlich, wie gesagt, auch verwalten die Gültigkeit und dafür können 14 00:01:00,230 --> 00:01:03,590 wir einen weiteren Zustand hinzufügen, den wir verwalten möchten. 15 00:01:03,590 --> 00:01:10,580 Vielleicht können wir hier nach der Verwaltung des Titelwerts auch festlegen, dass der Titel ein gültiger Status ist oder wie 16 00:01:10,580 --> 00:01:16,100 auch immer Sie ihn aufrufen möchten, und dass der hinzugefügte Set-Titel hier als Setter-Funktion gültig 17 00:01:16,280 --> 00:01:18,780 ist. Dieser Status hier könnte dann 18 00:01:18,800 --> 00:01:27,000 zunächst falsch sein, sodass wir ihn zunächst behandeln dies als ungültig. Jetzt können wir dies für jeden Tastendruck hier im Titeländerungshandler 19 00:01:27,630 --> 00:01:33,180 überprüfen, bevor wir dies speichern und unseren Titelstatus aktualisieren können. Jetzt liegt es ganz 20 00:01:33,210 --> 00:01:36,320 bei Ihnen, wie Sie dies überprüfen möchten. 21 00:01:36,390 --> 00:01:45,130 Sie können beispielsweise sagen, dass dies nur gültig ist, wenn Sie einen Text haben, der nicht leer ist. Wenn also der Text länger 22 00:01:45,130 --> 00:01:47,990 als Null ist. Text ist natürlich eine Zeichenfolge. 23 00:01:48,000 --> 00:01:51,650 Wenn die Länge also Null ist, bedeutet dies, dass es sich um eine leere Zeichenfolge handelt. 24 00:01:51,660 --> 00:01:58,920 Wir können auch Text nennen. Trimmen, um überschüssiges Leerzeichen zu kürzen, sodass auch nur ein paar Leerzeichen 25 00:01:58,920 --> 00:02:00,630 nicht als gültig behandelt werden. 26 00:02:00,660 --> 00:02:05,760 Natürlich können Sie auch die Validierung der minimalen oder maximalen Länge hinzufügen, indem Sie die Länge hier überprüfen. Sie 27 00:02:05,790 --> 00:02:10,420 können auch die Validierung regulärer Ausdrücke hinzufügen, um den Text auf bestimmte Muster zu überprüfen. Dies werden 28 00:02:10,440 --> 00:02:12,820 wir später auch tun, aber um loszulegen, 29 00:02:13,170 --> 00:02:15,620 werde ich es tun Überprüfen Sie es einfach so 30 00:02:16,110 --> 00:02:19,490 und jetzt hier, wenn wir größer als Null sind, geht es uns 31 00:02:19,500 --> 00:02:23,550 gut, aber wenn wir eine Länge von Null haben, geht es uns nicht gut. 32 00:02:23,550 --> 00:02:25,100 Hier möchte ich also 33 00:02:25,320 --> 00:02:30,870 festlegen, dass der Titel gültig auf falsch gesetzt ist, andernfalls setzen wir den festgelegten 34 00:02:30,880 --> 00:02:31,810 Titel 35 00:02:31,810 --> 00:02:34,810 natürlich auf wahr. Wenn wir also eine gültige 36 00:02:34,810 --> 00:02:40,420 Eingabe haben und den Titel immer selbst festlegen, müssen wir das immer speichern, wir 37 00:02:40,420 --> 00:02:42,580 darf diese Benutzereingabe niemals verlieren, sonst 38 00:02:42,580 --> 00:02:44,410 brechen wir die App. 39 00:02:44,410 --> 00:02:50,890 Und jetzt, da die Titelgültigkeit im Status gespeichert ist, können wir sie natürlich hier in unserem jsx-Code verwenden, um zu 40 00:02:50,890 --> 00:02:56,980 überprüfen, ob der Titel zum Beispiel nicht gültig ist, und wenn dies der Fall ist, können wir hier dynamisch 41 00:02:56,980 --> 00:03:04,000 einen Text ausgeben, wo wir zum Beispiel sagen Bitte geben Sie einen gültigen Titel ein, um hier eine kleine Fehlermeldung anzuzeigen, der 42 00:03:04,000 --> 00:03:06,670 Sie natürlich auch ein Styling zuweisen können. 43 00:03:06,700 --> 00:03:11,530 Wenn Sie hier zu unserer Eingabe gehen, sehen Sie, dass die Fehlermeldung von Anfang an angezeigt 44 00:03:11,560 --> 00:03:15,900 wird, da wir in einem ungültigen Zustand beginnen. Wenn wir mit der Eingabe beginnen, 45 00:03:15,910 --> 00:03:22,330 verschwindet diese, aber wenn ich alle Eingaben entferne, wird sie erneut angezeigt Einige grundlegende Überprüfungen, die Sie hinzufügen können, um Ihrem Benutzer 46 00:03:22,390 --> 00:03:27,910 eine kleine Fehlermeldung oder einen kleinen Hinweis anzuzeigen, um sicherzustellen, dass die Benutzer zumindest eine Vorstellung davon haben, 47 00:03:27,910 --> 00:03:29,790 welche Art von Eingabe Sie wünschen. 48 00:03:29,800 --> 00:03:36,700 Jetzt können Sie diese Gültigkeit natürlich nicht nur zum Ausgeben von Fehlermeldungen verwenden, sondern auch vermeiden, dass Ihr 49 00:03:36,700 --> 00:03:39,780 Formular gesendet wird, wenn es ungültig ist. 50 00:03:39,820 --> 00:03:47,230 Hier im Submit-Handler, wo ich meine Daten immer übermittle und ein Produkt erstelle oder aktualisiere, unabhängig davon, ob die Eingabe gültig 51 00:03:47,230 --> 00:03:51,190 ist, können wir die gesammelten Gültigkeitsdaten verwenden und beispielsweise prüfen, ob 52 00:03:51,190 --> 00:03:56,530 der Titel gültig ist und nicht gültig, daher das Ausrufezeichen, dann kehren wir einfach zurück, 53 00:03:56,550 --> 00:03:58,000 was bedeutet, dass wir 54 00:03:58,060 --> 00:03:59,500 die Funktionsausführung abbrechen 55 00:03:59,500 --> 00:04:04,770 und der Code danach nicht ausgeführt wird. Außerdem möchten wir möglicherweise nicht nur zurückkehren, sondern 56 00:04:04,850 --> 00:04:07,490 können natürlich auch eine Warnung aus React 57 00:04:07,510 --> 00:04:13,630 Native importieren und a auslösen nette native Warnung hier. Wir können also einfach eine Warnung mit einer 58 00:04:13,630 --> 00:04:24,520 Meldung über falsche Eingaben oder einem Titel davon und einer Meldung mit der Bitte überprüfen Sie die Fehler im Formular und fügen Sie dort einfach eine Schaltfläche 59 00:04:25,090 --> 00:04:32,620 hinzu, auf der wir "OK" sagen, da dann nichts anderes zu tun ist, um dies zu bestätigen Damit haben 60 00:04:32,620 --> 00:04:33,870 wir hier 61 00:04:34,180 --> 00:04:39,760 einen schönen Ablauf, in dem wir den Benutzer warnen, dass die Eingabe ungültig ist. 62 00:04:39,760 --> 00:04:45,570 Wenn ich zum Beispiel jetzt versuche, diese Eingabe mit meinem ungültigen Titel zu senden, wird dieser Fehler angezeigt. Nur wenn 63 00:04:45,580 --> 00:04:51,250 ich einen gültigen Titel eingebe, kann ich ihn senden, da ich noch keine Validierung für die anderen Eingaben hinzugefügt 64 00:04:51,250 --> 00:04:53,140 habe, die wir natürlich sollten . 65 00:04:53,140 --> 00:04:56,410 So einfach können Sie mit der Validierung beginnen. 66 00:04:56,440 --> 00:05:02,260 Da wir hier Javascript verwendet haben, können Sie natürlich auch andere Validierungsbibliotheken von Drittanbietern einbinden, z. B. 67 00:05:02,950 --> 00:05:09,250 ValidateJS, ein Paket, das Sie in Ihr Projekt installieren und verwenden können, um Zeichenfolgen für bestimmte Muster einfach zu 68 00:05:09,250 --> 00:05:15,310 validieren, wenn Sie dies möchten das zu tun. In diesem Modul schreibe ich die grundlegenden 69 00:05:15,310 --> 00:05:15,900 Muster, 70 00:05:15,910 --> 00:05:21,760 die wir manuell verwenden, damit Sie ein klares Verständnis dafür bekommen, was dort wirklich 71 00:05:21,790 --> 00:05:26,370 passiert, aber Sie können auch solche Bibliotheken von Drittanbietern unbedingt einbinden. 72 00:05:26,380 --> 00:05:31,850 Nun, mit diesem grundlegenden Verständnis der Validierung und so weiter, stellen wir sicher, 73 00:05:31,990 --> 00:05:38,530 dass wir jetzt auch zu einem Formular- und Eingabemanagement übergehen, das skalierbarer ist und nicht Tonnen 74 00:05:38,620 --> 00:05:42,550 von Zuständen umfasst, die wir manuell verwalten müssen.