Löschen von Daten aus dem Speicher in React Router
Unsere Anwendung kann neue Produkte hinzufügen, Daten bearbeiten, es bleibt nur noch, das Löschen von Daten hinzuzufügen. Dafür durchlaufen wir erneut die Schritte, die uns aus den vorherigen Lektionen bekannt sind.
Zuerst öffnen wir die Datei forStorage.js
und fügen die letzte Funktion zum Löschen
eines bestimmten Produkts deleteProduct
anhand seiner id hinzu:
export async function deleteProduct(id) {}
Dann holen wir uns die Produktliste aus dem Speicher
und finden den Index des Produkts, das wir löschen wollen.
Wenn ein solches Produkt vorhanden ist, löschen wir es aus
der Liste mit splice.
Anschließend rufen wir setProducts auf und
legen die neue Produktliste
im Speicher ab:
export async function deleteProduct(id) {
let products = await localforage.getItem('products');
let index = products.findIndex((product) => product.id === id);
if (index > -1) {
products.splice(index, 1);
await setProducts(products);
return true;
}
return false;
}
Nehmen Sie die Anwendung, die Sie in den
Aufgaben zu den vergangenen Lektionen erstellt haben.
Verwenden Sie die Unterrichtsmaterialien und schreiben Sie die Funktion
deleteStudent zum Löschen von Daten
eines Studenten aus dem Speicher anhand der id.