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:

forStorage.jsexport 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:

forStorage.jsexport 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:

forStorage.jsexport 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;
}
Задание 1

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.