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