Ажурирање података преко URL параметара у React Router депоу

На прошлом уроке смо додали још једну руту и страницу са формом за уређивање података. Остало нам је да сачувамо податке унете у нашу форму.

За почетак ћемо додати функцију за ажурирање података о производу updateProduct у forStorage.js. Потребно је да проследимо у њу id производа и измењене податке:

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

Затим ћемо из депоа по кључу 'products' добити производе и пронаћи онај који мењамо по његовом id. У случају неуспеха бацићемо грешку:

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

Затим нам остаје да внесемо измене у пронађени производ и преписемо ажурирани списак у депо помоћу наше функције 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

Узмите апликацију коју сте креирали у задацима из претходних лекција. Користећи се материјалом из лекције, додајте у фајл forStorage.js функцију updateStudent за ажурирање података о студенту у депоу.