URL पैरामीटर्स के अनुसार डेटा को React Router के स्टोर में अपडेट करना

पिछले पाठ में हमने एक और रूट और डेटा एडिट करने के लिए एक फॉर्म पेज जोड़ा। अब हमें अपने फॉर्म में डाले गए डेटा को सेव करना बाकी है।

सबसे पहले forStorage.js में प्रोडक्ट डेटा अपडेट करने के लिए फंक्शन updateProduct जोड़ें। हमें इसमें प्रोडक्ट की 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 जोड़ें।