Kusasisha Data kulingana na Vigezo vya URL kwenye Kuhifadhi kwenye React Router

Katika somo lililopita tuliongeza njia nyingine na ukurasa wa fomu ya kuhariri data. Tumebakiwa na kuhifadhi data iliyoingizwa kwenye fomu yetu.

Kuanza, tuongeze kitendo cha kusasisha data ya bidhaa updateProduct kwenye forStorage.js. Tunahitaji kupitisha ndani yake id ya bidhaa na data iliyobadilishwa:

export async function updateProduct(id, updates) {
	await someNetwork();
}

Ifuatayo kutoka kwenye kuhifadhi kwa ufunguo 'products' tutapata bidhaa na tutapata ile tunayobadilisha kulingana na id yake. Kwa upande wa kushindwa tutatupa kosa:

export 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('Hakuna bidhaa iliyopatikana kwa hii', id);				
}

Kisha tunabakiwa na kuingiza mabadiliko kwenye bidhaa iliyopatikana na kuandika upya orodha iliyosasishwa kwenye kuhifadhi kwa kutumia kitendo chetu setProducts:

export 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('Hakuna bidhaa iliyopatikana kwa hii', id);
	Object.assign(product, updates);
	await setProducts(products);
	return product;
}

Chukua programu iliyoundwa na wewe kwenye kazi za masomo yaliyopita. Kwa kutumia nyenzo za somo, ongeza kwenye faili forStorage.js kitendo updateStudent kwa kusasisha data ya mwanafunzi kwenye kuhifadhi.