Aktualizácia údajov podľa URL parametrov v úložisku v React Router

V predchádzajúcej lekcii sme pridali ešte jednu trasu a stránku s formulárom pre úpravu údajov. Ostáva nám uložiť údaje zadané do nášho formulára.

Na začiatok pridajme funkciu na aktualizáciu údajov produktu updateProduct v forStorage.js. Potrebujeme do nej odovzdať jeho id a zmenené údaje:

export async function updateProduct(id, updates) {
	await someNetwork();
}

Ďalej z úložiska pod kľúčom 'products' získame produkty a nájdeme ten, ktorý upravujeme podľa jeho id. V prípade neúspechu vyhodíme chybu:

export async function updateProduct(id, updates) {
	await someNetwork();
	let products = await localforage.getItem('products');
	let product = products.find((product) => product.id === id);
	if (!product) throw new Error('No product found for this', id);				
}

Potom nám ostáva aplikovať zmeny na nájdený produkt a prepísať aktualizovaný zoznam v úložisku pomocou našej funkcie setProducts:

export async function updateProduct(id, updates) {
	await someNetwork();
	let products = await localforage.getItem('products');
	let product = products.find((product) => product.id === id);
	if (!product) throw new Error('No product found for this', id);
	Object.assign(product, updates);
	await setProducts(products);
	return product;
}

Vezmite aplikáciu, ktorú ste vytvorili v úlohách k predchádzajúcim lekciám. Použitím materiálov z lekcie pridajte do súboru forStorage.js funkciu updateStudent na aktualizáciu údajov študenta v úložisku.