Um nun in diesem Modul zu Ende zu gehen, möchte ich sicherstellen, dass wir auch Bestellungen auf einem Server
speichern und diese natürlich auch von dort abrufen.
Jetzt haben wir hier und da den Befehlsaktionsersteller, wir können Redux Thunk wieder nutzen und unsere Funktion hier
zurückgeben, die diese Versandfunktion erhält, die mit dem Schlüsselwort async asynchron sein sollte, damit wir async
await und in dieser Funktion hier verwenden
können was wir zurückgeben, letztendlich werde ich natürlich mein Aktionsobjekt versenden, aber bevor wir das tun, können wir jetzt
eine Anfrage senden, um diese Bestellung auf einem Server zu speichern, und wir können diese Anfrage vom
Ersteller der Produktaktion ausleihen. Es ist nicht wirklich
ein großer Unterschied, ob wir ein Produkt oder diese Bestellung erstellen. Daher können wir den gesamten
Code für die Produkterstellung hier bis hierher kopieren und auf die Bestellungen übertragen. js Datei.
Jetzt können Sie hier natürlich
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
bekomme, ob die Antwort nicht in Ordnung ist. In diesem
Fall möchte ich Um einen neuen Fehler auszulösen, ist ein Fehler aufgetreten, aber das sollte hier nicht im Mittelpunkt stehen, da wir
uns mit der Fehlerbehandlung und dem
Laden von Spinnern befasst haben, nicht wirklich
mit dem Teil, auf den ich mich hier konzentrieren möchte. Stellen Sie stattdessen sicher, dass wir diese
Anfrage
an die senden Die richtige Adresse und das sollte nicht der Produktknoten sein, aber sagen wir der
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
/ U1 speichern können, was meine Dummy-Benutzer-ID ist, die ich hier annehme. Später wird das anders sein, später haben
wir hier eine echte ID, eine dynamische ID. Im
Moment codieren wir diese hier einfach fest, damit wir einen Unterordner haben, einen Unterordner pro Benutzer später.
Es sollte eine Post-Anfrage sein, da wir hinzufügen, einige neue Daten anhängen und eine neue Bestellung hinzufügen.
Dieser Header muss gesetzt werden und
natürlich sind die Daten, die wir senden, anders. Dort möchte ich
meine Kartenartikel und meinen Gesamtbetrag sowie eine weitere wichtige Sache, das Datum der Bestellung, senden.
Ich möchte mein Datum hier konvertiert in eine Zeichenfolge mit toISOString für das Datumsobjekt senden, damit wir dies lokal
in der App erstellen und dann den Zeitstempel auf dem Server speichern.
In Ihrer App möchten Sie möglicherweise auch die Datumserstellung auf dem Server durchführen. Da sich dieser Kurs jedoch nicht
auf die serverseitige Programmierung konzentrieren sollte, werden wir dies hier tun und an den Server senden, ohne uns zu viele
Sorgen machen zu müssen Was ein Server sonst noch
für uns tun könnte, lassen Sie uns stattdessen alle Dinge hier erledigen und einfach den fertigen Zeitstempel an den Server senden.
Jetzt wird hier eine Bestellung hinzugefügt, und sobald wir fertig sind, erhalten wir unsere Antwortdaten zurück, die
die automatisch generierte ID enthalten, wenn Sie sich erinnern, dass wir dies auch bei der Produkterstellung getan haben.
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
ID weiterleiten, die ich von resData erhalte. Name, das ist die gleiche
Logik, die wir beim Erstellen eines Produkts verwendet haben, und es gibt noch eine weitere Sache: Mein Datums-Snapshot sollte natürlich
der gleiche sein, der hier erstellt wurde.
Eigentlich werde ich hier meinen Schnappschuss erstellen, mit einem neuen Datum datieren und dann diese Konstante hier verwenden, um meine
Zeichenfolgenversion zu erstellen, und dieselbe Konstante hier verwenden, um sie mit meinen Bestelldaten weiterzuleiten.
Das Datum bezieht sich hier also auf diese
Datumskonstante, sodass ich ein und denselben Zeitstempel verwende, sowohl lokal in meinen mit Redux verwalteten Daten, mit denen
ich hier in dieser laufenden App arbeite, als auch natürlich denselben Zeitstempel auf dem Server Welches sind die Daten, die
ich in Zukunft laden werde, oder andere Geräte werden geladen. Und jetzt müssen wir nur noch
am Auftragsreduzierer arbeiten, um einen Auftrag hinzuzufügen.
Die ID ist jetzt etwas, das ich von außen
bekomme, also habe ich hier orderData. ID, weil wir das hier
weiterleiten. Es ist die automatisch generierte ID, die Firebase uns gibt, und das Datum wird
auch von außen empfangen. Hier können wir jetzt orderData verwenden. Datum wie dieses und damit haben wir die ganze Logik, um
hoffentlich eine Bestellung hinzuzufügen.
Lassen Sie uns jetzt hierher zurückkehren und dies in den Warenkorb legen und auf "Jetzt bestellen" klicken. Dies scheint zu funktionieren.
Wenn wir zurückgehen, sehen wir hier auf Firebase einen Auftragsknoten mit einem U1-Unterordner für unseren Benutzer mit der
generierten eindeutigen ID und dort. die Bestelldaten mit dem Zeitstempel mit dem Preis, mit den Kartenartikeln, die dieses eine
weiße Hemd waren und die nicht allzu schlecht aussehen, würde ich sagen.