Duomenų atnaujinimas pagal URL parametrus saugykloje React Router

Ankstesnėje pamokoje mes pridėjome dar vieną maršrutą ir formos puslapį duomenų redagavimui. Mums belieka išsaugoti į mūsų formą įvestus duomenis.

Pirmiausia pridėkime funkciją duomenų produkto atnaujinimui updateProduct į forStorage.js. Mums reikia perduoti į ją id produkto ir pakeistus duomenis:

forStorage.jsexport async function updateProduct(id, updates) {
  await someNetwork();
}

Toliau iš saugyklos pagal raktą 'products' gausime produktus ir rasime tą, kurį keičiame pagal jo id. Jei nepavyks, mes išmesime klaidą:

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

Tada mums belieka įtraukti pakeitimus į rastą produktą ir perrašyti atnaujintą sąrašą saugykloje naudodami mūsų funkciją 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;
}