Actualizarea datelor prin parametrii URL în stocarea în React Router

În lecția precedentă am adăugat încă o rută și o pagină cu un formular pentru editarea datelor. Ne rămâne să salvăm datele introduse în formularul nostru.

Pentru început, să adăugăm o funcție pentru actualizarea datelor produsului updateProduct în forStorage.js. Trebuie să transmitem în ea id-ul produsului și datele modificate:

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

Apoi, din stocare, prin cheia 'products' obținem produsele și găsim acela pe care îl modificăm după id-ul său. În caz de eșec aruncăm o eroare:

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);				
}

Apoi, nu ne rămâne decât să introducem modificările în produsul găsit și să rescriem lista actualizată în stocare cu ajutorul funcției noastre 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;
}

Luați aplicația creată de dvs. în sarcinile din lecțiile anterioare. Folosind materialele lecției, adăugați în fișierul forStorage.js funcția updateStudent pentru actualizarea datelor studentului în stocare.