1 00:00:02,250 --> 00:00:07,800 Um nun in diesem Modul zu Ende zu gehen, möchte ich sicherstellen, dass wir auch Bestellungen auf einem Server 2 00:00:07,800 --> 00:00:10,530 speichern und diese natürlich auch von dort abrufen. 3 00:00:10,540 --> 00:00:16,810 Jetzt haben wir hier und da den Befehlsaktionsersteller, wir können Redux Thunk wieder nutzen und unsere Funktion hier 4 00:00:16,810 --> 00:00:22,780 zurückgeben, die diese Versandfunktion erhält, die mit dem Schlüsselwort async asynchron sein sollte, damit wir async 5 00:00:22,810 --> 00:00:25,280 await und in dieser Funktion hier verwenden 6 00:00:25,570 --> 00:00:32,110 können was wir zurückgeben, letztendlich werde ich natürlich mein Aktionsobjekt versenden, aber bevor wir das tun, können wir jetzt 7 00:00:32,110 --> 00:00:38,320 eine Anfrage senden, um diese Bestellung auf einem Server zu speichern, und wir können diese Anfrage vom 8 00:00:38,320 --> 00:00:41,650 Ersteller der Produktaktion ausleihen. Es ist nicht wirklich 9 00:00:41,710 --> 00:00:46,930 ein großer Unterschied, ob wir ein Produkt oder diese Bestellung erstellen. Daher können wir den gesamten 10 00:00:46,930 --> 00:00:59,170 Code für die Produkterstellung hier bis hierher kopieren und auf die Bestellungen übertragen. js Datei. 11 00:00:59,180 --> 00:01:00,450 Jetzt können Sie hier natürlich 12 00:01:00,470 --> 00:01:05,530 auch eine Fehlerbehandlung hinzufügen. Ich habe sie hier nicht. Eine Sache, die ich zumindest hinzufügen möchte, ist, dass ich keine Überprüfung 13 00:01:05,540 --> 00:01:07,880 bekomme, ob die Antwort nicht in Ordnung ist. In diesem 14 00:01:07,880 --> 00:01:13,130 Fall möchte ich Um einen neuen Fehler auszulösen, ist ein Fehler aufgetreten, aber das sollte hier nicht im Mittelpunkt stehen, da wir 15 00:01:13,130 --> 00:01:14,500 uns mit der Fehlerbehandlung und dem 16 00:01:14,510 --> 00:01:16,410 Laden von Spinnern befasst haben, nicht wirklich 17 00:01:16,440 --> 00:01:20,420 mit dem Teil, auf den ich mich hier konzentrieren möchte. Stellen Sie stattdessen sicher, dass wir diese 18 00:01:20,450 --> 00:01:21,080 Anfrage 19 00:01:21,110 --> 00:01:25,150 an die senden Die richtige Adresse und das sollte nicht der Produktknoten sein, aber sagen wir der 20 00:01:25,520 --> 00:01:32,260 Bestellknoten, welche Art von Sinn macht, denke ich, weil wir unsere Bestellungen speichern wollen. Vielleicht möchten wir auch unsere benutzerspezifischen Bestellungen speichern, damit wir diese unter / orders 21 00:01:32,260 --> 00:01:38,740 / U1 speichern können, was meine Dummy-Benutzer-ID ist, die ich hier annehme. Später wird das anders sein, später haben 22 00:01:38,740 --> 00:01:42,040 wir hier eine echte ID, eine dynamische ID. Im 23 00:01:42,040 --> 00:01:48,350 Moment codieren wir diese hier einfach fest, damit wir einen Unterordner haben, einen Unterordner pro Benutzer später. 24 00:01:48,610 --> 00:01:53,980 Es sollte eine Post-Anfrage sein, da wir hinzufügen, einige neue Daten anhängen und eine neue Bestellung hinzufügen. 25 00:01:53,980 --> 00:01:55,360 Dieser Header muss gesetzt werden und 26 00:01:55,360 --> 00:01:58,170 natürlich sind die Daten, die wir senden, anders. Dort möchte ich 27 00:01:58,210 --> 00:02:05,020 meine Kartenartikel und meinen Gesamtbetrag sowie eine weitere wichtige Sache, das Datum der Bestellung, senden. 28 00:02:05,890 --> 00:02:12,820 Ich möchte mein Datum hier konvertiert in eine Zeichenfolge mit toISOString für das Datumsobjekt senden, damit wir dies lokal 29 00:02:12,820 --> 00:02:17,530 in der App erstellen und dann den Zeitstempel auf dem Server speichern. 30 00:02:17,530 --> 00:02:22,180 In Ihrer App möchten Sie möglicherweise auch die Datumserstellung auf dem Server durchführen. Da sich dieser Kurs jedoch nicht 31 00:02:22,180 --> 00:02:27,100 auf die serverseitige Programmierung konzentrieren sollte, werden wir dies hier tun und an den Server senden, ohne uns zu viele 32 00:02:27,100 --> 00:02:29,450 Sorgen machen zu müssen Was ein Server sonst noch 33 00:02:29,530 --> 00:02:34,500 für uns tun könnte, lassen Sie uns stattdessen alle Dinge hier erledigen und einfach den fertigen Zeitstempel an den Server senden. 34 00:02:34,570 --> 00:02:40,300 Jetzt wird hier eine Bestellung hinzugefügt, und sobald wir fertig sind, erhalten wir unsere Antwortdaten zurück, die 35 00:02:40,330 --> 00:02:46,090 die automatisch generierte ID enthalten, wenn Sie sich erinnern, dass wir dies auch bei der Produkterstellung getan haben. 36 00:02:46,090 --> 00:02:51,820 Wenn wir also jetzt eine Bestellung hinzufügen, leiten wir natürlich unsere Artikel und den Betrag weiter, aber jetzt möchte ich auch die 37 00:02:51,820 --> 00:02:55,990 ID weiterleiten, die ich von resData erhalte. Name, das ist die gleiche 38 00:02:56,170 --> 00:03:02,710 Logik, die wir beim Erstellen eines Produkts verwendet haben, und es gibt noch eine weitere Sache: Mein Datums-Snapshot sollte natürlich 39 00:03:02,710 --> 00:03:05,040 der gleiche sein, der hier erstellt wurde. 40 00:03:05,050 --> 00:03:14,010 Eigentlich werde ich hier meinen Schnappschuss erstellen, mit einem neuen Datum datieren und dann diese Konstante hier verwenden, um meine 41 00:03:14,010 --> 00:03:20,840 Zeichenfolgenversion zu erstellen, und dieselbe Konstante hier verwenden, um sie mit meinen Bestelldaten weiterzuleiten. 42 00:03:20,850 --> 00:03:23,730 Das Datum bezieht sich hier also auf diese 43 00:03:23,730 --> 00:03:29,400 Datumskonstante, sodass ich ein und denselben Zeitstempel verwende, sowohl lokal in meinen mit Redux verwalteten Daten, mit denen 44 00:03:29,400 --> 00:03:35,670 ich hier in dieser laufenden App arbeite, als auch natürlich denselben Zeitstempel auf dem Server Welches sind die Daten, die 45 00:03:35,670 --> 00:03:41,880 ich in Zukunft laden werde, oder andere Geräte werden geladen. Und jetzt müssen wir nur noch 46 00:03:41,900 --> 00:03:45,500 am Auftragsreduzierer arbeiten, um einen Auftrag hinzuzufügen. 47 00:03:45,500 --> 00:03:48,450 Die ID ist jetzt etwas, das ich von außen 48 00:03:48,470 --> 00:03:52,910 bekomme, also habe ich hier orderData. ID, weil wir das hier 49 00:03:52,940 --> 00:03:58,700 weiterleiten. Es ist die automatisch generierte ID, die Firebase uns gibt, und das Datum wird 50 00:03:58,910 --> 00:04:06,100 auch von außen empfangen. Hier können wir jetzt orderData verwenden. Datum wie dieses und damit haben wir die ganze Logik, um 51 00:04:06,250 --> 00:04:07,600 hoffentlich eine Bestellung hinzuzufügen. 52 00:04:07,630 --> 00:04:14,710 Lassen Sie uns jetzt hierher zurückkehren und dies in den Warenkorb legen und auf "Jetzt bestellen" klicken. Dies scheint zu funktionieren. 53 00:04:14,740 --> 00:04:20,890 Wenn wir zurückgehen, sehen wir hier auf Firebase einen Auftragsknoten mit einem U1-Unterordner für unseren Benutzer mit der 54 00:04:20,890 --> 00:04:27,400 generierten eindeutigen ID und dort. die Bestelldaten mit dem Zeitstempel mit dem Preis, mit den Kartenartikeln, die dieses eine 55 00:04:27,400 --> 00:04:31,570 weiße Hemd waren und die nicht allzu schlecht aussehen, würde ich sagen.